Merge pull request 'Fix btnTextDir subscription for “Diagram” and “OLE” modes' (#968) from fix/btnTextDir into release/v9.3.0

Reviewed-on: https://git.onlyoffice.com/ONLYOFFICE/web-apps/pulls/898

.github/workflows/ci-build-upload.yml

@@ -119,7 +119,7 @@ jobs:
             env:
                 URI: ${{steps.tag-dir.outputs.URI}}
             run: |
-                aws cloudfront create-invalidation \
-                    --distribution-id ${{ secrets.AWS_DISTRIBUTION_ID }} \
-                    --paths \
-                    "${URI}/*"
+                API_STATUS=$(aws apigateway test-invoke-method --rest-api-id ${{ secrets.AWS_REST_API_ID }} --resource-id "${{ secrets.AWS_RESOURCE_ID }}" \
+                  --http-method PUT --path-with-query-string "/prod/download-oo-com" --body "$(jq -c -n '.paths = $ARGS.positional' --args "${URI}/*")" \
+                  --region us-east-1 --query 'status' --output text || :)
+                echo "API Gateway test-invoke status: ${API_STATUS:-<failed>}"

apps/api/documents/api.js

@@ -513,7 +513,7 @@
 
                 if (typeof _config.document.fileType === 'string' && _config.document.fileType != '') {
                     _config.document.fileType = _config.document.fileType.toLowerCase();
-                    var type = /^(?:(xls|xlsx|ods|csv|gsheet|xlsm|xlt|xltm|xltx|fods|ots|xlsb|sxc|et|ett|numbers)|(pps|ppsx|ppt|pptx|odp|gslides|pot|potm|potx|ppsm|pptm|fodp|otp|sxi|dps|dpt|key|odg)|(pdf|djvu|xps|oxps)|(doc|docx|odt|gdoc|txt|rtf|mht|htm|html|mhtml|epub|docm|dot|dotm|dotx|fodt|ott|fb2|xml|oform|docxf|sxw|stw|wps|wpt|pages|hwp|hwpx|md|hml)|(vsdx|vssx|vstx|vsdm|vssm|vstm))$/
+                    var type = /^(?:(xls|xlsx|ods|csv|tsv|gsheet|xlsm|xlt|xltm|xltx|fods|ots|xlsb|sxc|et|ett|numbers)|(pps|ppsx|ppt|pptx|odp|gslides|pot|potm|potx|ppsm|pptm|fodp|otp|sxi|dps|dpt|key|odg)|(pdf|djvu|xps|oxps)|(doc|docx|odt|gdoc|txt|rtf|mht|htm|html|mhtml|epub|docm|dot|dotm|dotx|fodt|ott|fb2|xml|oform|docxf|sxw|stw|wps|wpt|pages|hwp|hwpx|md|hml)|(vsdx|vssx|vstx|vsdm|vssm|vstm))$/
                                     .exec(_config.document.fileType);
                     if (!type) {
                         window.alert("The \"document.fileType\" parameter for the config object is invalid. Please correct it.");
@@ -1108,7 +1108,7 @@
             isForm = false;
         if (config.document) {
             if (typeof config.document.fileType === 'string')
-                type = /^(?:(pdf)|(djvu|xps|oxps)|(xls|xlsx|ods|csv|xlst|xlsy|gsheet|xlsm|xlt|xltm|xltx|fods|ots|xlsb|numbers)|(pps|ppsx|ppt|pptx|odp|pptt|ppty|gslides|pot|potm|potx|ppsm|pptm|fodp|otp|key|odg)|(oform|docxf)|(vsdx|vssx|vstx|vsdm|vssm|vstm))$/
+                type = /^(?:(pdf)|(djvu|xps|oxps)|(xls|xlsx|ods|csv|tsv|xlst|xlsy|gsheet|xlsm|xlt|xltm|xltx|fods|ots|xlsb|numbers)|(pps|ppsx|ppt|pptx|odp|pptt|ppty|gslides|pot|potm|potx|ppsm|pptm|fodp|otp|key|odg)|(oform|docxf)|(vsdx|vssx|vstx|vsdm|vssm|vstm))$/
                     .exec(config.document.fileType);
 
             if (config.document.permissions)

apps/api/wopi/editor-wopi.ejs

@@ -287,6 +287,11 @@ div {
         }
 
         var connectEditor = function () {
+            var statusCode = "<%= typeof statusCode !== 'undefined' ? statusCode : '' %>";
+            if (statusCode) {
+                handleWopiError(statusCode);
+                return;
+            }
 
             fileInfo = JSON.parse(document.getElementById('fileInfoJsonData').getAttribute('data-json'));
 
@@ -438,6 +443,55 @@ div {
             document.body.appendChild(newDiv);
         };
 
+        /**
+         * Handle WOPI error status and show appropriate error message
+         * @param {number|string} statusCode - HTTP status code
+         * @returns {boolean} - Returns true if error was handled, false if no error
+         */
+        var handleWopiError = function (statusCode) {
+            if (!statusCode) {
+                return false;
+            }
+            const status = parseInt(statusCode, 10);
+            // WOPI spec-compliant error messages
+            // https://learn.microsoft.com/en-us/microsoft-365/cloud-storage-partner-program/rest/files/checkfileinfo#status-codes
+            var errorMessage;
+            switch (status) {
+                case 400:
+                    errorMessage = 'Bad Request - malformed or invalid request';
+                    break;
+                case 401:
+                    errorMessage = 'Invalid access token';
+                    break;
+                case 403:
+                    errorMessage = 'Access forbidden';
+                    break;
+                case 404:
+                    errorMessage = 'Resource not found or user unauthorized';
+                    break;
+                case 409:
+                    errorMessage = 'Conflict - lock mismatch or file version conflict';
+                    break;
+                case 412:
+                    errorMessage = 'Precondition Failed - lock token mismatch';
+                    break;
+                case 413:
+                    errorMessage = 'Payload Too Large - file size exceeds limits';
+                    break;
+                case 500:
+                    errorMessage = 'Internal server error or invalid proof keys';
+                    break;
+                case 501:
+                    errorMessage = 'Not Implemented - operation not supported';
+                    break;
+                case 507:
+                    errorMessage = 'Insufficient Storage - not enough storage space';
+                    break;
+            }
+            showError(errorMessage);
+            return true;
+        }
+
 		//https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
 		if (typeof Object.assign !== 'function') {
 			// Must be writable: true, enumerable: false, configurable: true

apps/common/embed/lib/controller/Shortcuts.js

@@ -66,9 +66,9 @@
                 9: 'Tab',
                 12: 'Clear',
                 13: 'Enter',
-                16: 'Shift',
-                17: 'Ctrl',
-                18: 'Alt',
+                16: common.utils.isMac ? '⇧' : 'Shift',
+                17: common.utils.isMac ? '^' : 'Ctrl',
+                18: common.utils.isMac ? '⌥' : 'Alt',
                 19: 'Pause',
                 20: 'CapsLock',
                 27: 'Escape',
@@ -84,7 +84,7 @@
                 44: 'PrintScreen',
                 45: 'Insert',
                 46: 'Delete',
-                91: 'Meta',
+                91: common.utils.isMac ? '⌘' : 'Meta',
                 93: 'ContextMenu',
                 96: "Num 0",
                 97: "Num 1",
@@ -233,6 +233,10 @@
                         shortcuts[foundIndex].ascShortcut = copyAscShortcut;
                     }
                 }
+
+                if(actionsMap[actionType]) {
+                    actionsMap[actionType].shortcuts = shortcuts.sort(_sortComparator);
+                }
             }
         };
 
@@ -286,14 +290,48 @@
     
         var _getAscShortcutKeys = function(ascShortcut) {
             const keys = [];
-            ascShortcut.asc_IsCommand() && keys.push('⌘');
-            ascShortcut.asc_IsCtrl() && keys.push('Ctrl');
-            ascShortcut.asc_IsAlt() && keys.push('Alt');
-            ascShortcut.asc_IsShift() && keys.push('Shift');
+            ascShortcut.asc_IsCommand() && keys.push(_keyCodeToKeyName(91));
+            ascShortcut.asc_IsCtrl() && keys.push(_keyCodeToKeyName(17));
+            ascShortcut.asc_IsAlt() && keys.push(_keyCodeToKeyName(18));
+            ascShortcut.asc_IsShift() && keys.push(_keyCodeToKeyName(16));
             keys.push(_keyCodeToKeyName(ascShortcut.asc_GetKeyCode()));
             return keys;
         };
 
+        var _sortComparator = function(first, second) {
+            const priorityModifierKeys = ['asc_IsCommand', 'asc_IsCtrl', 'asc_IsAlt', 'asc_IsShift'];
+            function getWeight(ascShortcut) {
+                // Search for the first modifier key
+                let keyIndex = priorityModifierKeys.length;
+                for (let i = 0; i < priorityModifierKeys.length; i++) {
+                    if (ascShortcut[priorityModifierKeys[i]]()) {
+                        keyIndex = i;
+                        break;
+                    }
+                }
+
+                if (keyIndex === priorityModifierKeys.length) return -1;
+
+                // Count extra modifier keys
+                let extras = 0;
+                for (let j = 0; j < priorityModifierKeys.length; j++) {
+                    if (j !== keyIndex && ascShortcut[priorityModifierKeys[j]]()) extras++;
+                }
+
+                // weight = range for main key + “cost” of extra keys
+                return keyIndex * 100 + extras;
+            }
+
+            if (first.ascShortcut.asc_IsLocked() && !second.ascShortcut.asc_IsLocked()) return -1;
+            if (!first.ascShortcut.asc_IsLocked() && second.ascShortcut.asc_IsLocked()) return 1;
+
+            let wFirst = getWeight(first.ascShortcut);
+            let wSecond = getWeight(second.ascShortcut);
+
+            if (wFirst !== wSecond) return wFirst - wSecond;
+
+            return first.ascShortcut.asc_GetKeyCode() - second.ascShortcut.asc_GetKeyCode();
+        };
 
         // Utils
         var pairs = function(obj)  {

apps/common/locale.js

@@ -41,6 +41,9 @@ Common.Locale = new(function() {
         defLang = '{{DEFAULT_LANG}}',
         currentLang = defLang,
         _4letterLangs = ['pt-pt', 'zh-tw', 'sr-cyrl'];
+    
+    if ( defLang[0] == '{' )
+        currentLang = defLang = 'en';
 
     var _applyLocalization = function(callback) {
         _clearRtl();

apps/common/main/lib/component/BaseView.js

@@ -66,6 +66,7 @@ define([
             INSERT:     45,
             ZERO:       48,
             EQUALITY_FF:61,
+            META:       91,
             NUM_ZERO:   96,
             NUM_PLUS:   107,
             NUM_MINUS:  109,

apps/common/main/lib/component/DataView.js

@@ -142,7 +142,7 @@ define([
 
             el.html(this.template(this.model.toJSON()));
             el.addClass('item canfocused');
-            el.toggleClass('selected', this.model.get('selected') && this.model.get('allowSelected'));
+            el.toggleClass('selected', !!this.model.get('selected') && this.model.get('allowSelected'));
             el.attr('tabindex', this.options.tabindex || 0);
             el.attr('role', this.options.role ? this.options.role : 'listitem');
             
@@ -220,7 +220,7 @@ define([
             if (_.isUndefined(this.model.id))
                 return this;
             var el = this.$el || $(this.el);
-            el.toggleClass('selected', this.model.get('selected') && this.model.get('allowSelected'));
+            el.toggleClass('selected', !!this.model.get('selected') && this.model.get('allowSelected'));
             el.toggleClass('disabled', !!this.model.get('disabled'));
 
             this.trigger('change', this, this.model);
@@ -672,10 +672,11 @@ define([
                 });
             }
 
+            this.attachKeyEvents();
+
             if (this.disabled)
                 this.setDisabled(this.disabled);
 
-            this.attachKeyEvents();
             this.lastSelectedRec = null;
             this._layoutParams = undefined;
         },
@@ -989,7 +990,7 @@ define([
             if (this.enableKeyEvents && this.handleSelect) {
                 var el = $(this.el).find('.inner').addBack().filter('.inner');
                 el.addClass('canfocused');
-                el.attr('tabindex', this.tabindex.toString());
+                el.attr('tabindex', (this.tabindex || 0).toString());
                 el.on((this.parentMenu && this.useBSKeydown) ? 'dataview:keydown' : 'keydown', _.bind(this.onKeyDown, this));
                 el.on((this.parentMenu && this.useBSKeydown) ? 'dataview:keyup' : 'keyup', _.bind(this.onKeyUp, this));
             }
@@ -1013,6 +1014,12 @@ define([
             disabled = !!disabled;
             this.disabled = disabled;
             $(this.el).find('.inner').addBack().filter('.inner').toggleClass('disabled', disabled);
+
+            if (this.tabindex!==undefined) {
+                var el = $(this.el).find('.inner').addBack().filter('.inner');
+                disabled && (this.tabindex = el.attr('tabindex'));
+                el.attr('tabindex', disabled ? "-1" : this.tabindex);
+            }
         },
 
         isDisabled: function() {

apps/common/main/lib/component/DimensionPicker.js

@@ -82,7 +82,7 @@ define([
                 me.options.height = me.options.itemSize* this.options.minRows;
                 var rootEl = this.cmpEl;
 
-                me.borderColor = '#aaaaaa';
+                me.borderColor = Common.Utils.isIE ?'#000000' :Common.UI.Themes.currentThemeColor('--canvas-high-contrast');
                 me.fillColor = Common.Utils.isIE ?'#fff' :Common.UI.Themes.currentThemeColor('--background-normal');
                 me.borderColorHighlighted = Common.Utils.isIE ?'#bababa' :Common.UI.Themes.currentThemeColor('--border-preview-hover');
                 me.fillColorHighlighted = Common.Utils.isIE ?'#446995' :Common.UI.Themes.currentThemeColor('--background-accent-button');
@@ -163,6 +163,7 @@ define([
 
 
             changeColors: function (){
+                this.borderColor = Common.UI.Themes.currentThemeColor('--canvas-high-contrast');
                 this.fillColor = Common.UI.Themes.currentThemeColor('--background-normal');
                 this.borderColorHighlighted = Common.UI.Themes.currentThemeColor('--border-preview-hover');
                 this.fillColorHighlighted = Common.UI.Themes.currentThemeColor('--background-accent-button');

apps/common/main/lib/component/MenuItem.js

@@ -496,6 +496,14 @@ define([
         render: function () {
             Common.UI.MenuItem.prototype.render.call(this);
 
+            if (this.options.scaling !== false) {
+                var me = this;
+                me.cmpEl.attr('ratio', 'ratio');
+                me.cmpEl.on('app:scaling', function (e, info) {
+                    me.applyScaling(info.ratio);
+                });
+            }
+
             this.updateIcon();
             Common.NotificationCenter.on('uitheme:changed', this.updateIcons.bind(this));
             return this;
@@ -508,7 +516,7 @@ define([
         },
 
         updateIcon: function() {
-            this.cmpEl && this.cmpEl.find('> a img').attr('src', this.iconImg).addClass('custom-icon');
+            this.cmpEl && this.cmpEl.find('img.menu-item-icon').attr('src', this.iconImg).addClass('custom-icon');
         },
 
         applyScaling: function (ratio) {

apps/common/main/lib/component/Mixtbar.js

@@ -191,11 +191,10 @@ define([
 
             setFolded: function(value) {
                 this.isFolded = value;
-
                 var me = this;
-                if ( this.isFolded ) {
-                    if (!optsFold.$box) optsFold.$box = me.$el.find('.box-controls');
+                if (!optsFold.$box) optsFold.$box = me.$el.find('.box-controls');
 
+                if ( this.isFolded ) {
                     optsFold.$bar.addClass('folded z-clear').toggleClass('expanded', false);
                     optsFold.$bar.find('.tabs .ribtab').removeClass('active');
                     optsFold.$bar.on($.support.transition.end, function (e) {

apps/common/main/lib/component/SynchronizeTip.js

@@ -64,7 +64,7 @@ define([
                             '<% } %>',
                         '</div>',
                         '<% if ( scope.showLink ) { %>',
-                        '<div class="show-link"><label><%= scope.textLink %></label></div>',
+                        '<div class="show-link"><label><span><%= scope.textLink %></span></label></div>',
                         '<% } %>',
                         '<% if ( scope.showButton ) { %>',
                         '<div class="btn-div"><%= scope.textButton %></div>',

apps/common/main/lib/component/TabBar.js

@@ -302,8 +302,12 @@ define([
                 elem.addEventListener ? elem.addEventListener( type, fn, false ) : elem.attachEvent( "on" + type, fn );
             };
 
-            var eventname=(/Firefox/i.test(navigator.userAgent))? 'DOMMouseScroll' : 'mousewheel';
-            addEvent(this.$bar[0], eventname, _.bind(this._onMouseWheel,this));
+            if (Common.Utils.isMac) {
+                this.$bar[0].addEventListener('wheel', _.bind(this._onMouseWheelThrottled, this));
+            } else {
+                var eventname=(/Firefox/i.test(navigator.userAgent))? 'DOMMouseScroll' : 'mousewheel';
+                addEvent(this.$bar[0], eventname, _.bind(this._onMouseWheel,this));
+            }
             addEvent(this.$bar[0], 'dragstart', _.bind(function (event) {
                 event.dataTransfer.effectAllowed = 'copyMove';
             }, this));
@@ -367,6 +371,33 @@ define([
             Common.NotificationCenter.trigger('hints:clear');
         },
 
+        _onMouseWheelThrottled: function(e) {
+            var delta = (e.detail && -e.detail) || e.wheelDelta;
+            if (Math.abs(delta) < 10) {
+                return;
+            }
+
+            var now = Date.now();
+            if (this._lastWheelTime && now - this._lastWheelTime < 50) {
+                return;
+            }
+            this._lastWheelTime = now;
+
+            var hidden = this.checkInvisible(true);
+
+            if (delta < 0) {
+                if (hidden.last) {
+                    this.setTabVisible('forward');
+                }
+            } else {
+                if (hidden.first) {
+                    this.setTabVisible('backward');
+                }
+            }
+
+            Common.NotificationCenter.trigger('hints:clear');
+        },
+
         onProcessMouse: function(data) {
             if (data.type == 'mouseup' && this.dragging) {
                 var tab = this.getActive(true);

apps/common/main/lib/component/TreeView.js

@@ -254,6 +254,8 @@ define([
             },
 
             onClickItem: function(view, record, e) {
+                if ( this.disabled ) return;
+
                 var btn = $(e.target);
                 if (btn && (btn.hasClass('tree-caret') || btn.hasClass('btn-tree-caret'))) {
                     var tip = view.$el.data('bs.tooltip');

apps/common/main/lib/component/Window.js

@@ -158,6 +158,7 @@ define([
                 minheight: 0,
                 enableKeyEvents: true,
                 automove: true,
+                autoPosOnResize: 'none',    //center, relative
                 transparentMask: false,
                 role: 'dialog'
         };
@@ -355,6 +356,9 @@ define([
                 top < topedge ? (top = topedge) : top > this.dragging.maxy && (top = this.dragging.maxy);
 
                 this.$window.css({left: left, top: top});
+
+                this.dragging.wasDragged = true;
+                this.initConfig.autoPosOnResize == 'relative' && _calcWindowPositionRatio.call(this);
             }
         }
 
@@ -364,6 +368,35 @@ define([
             }
         }
 
+        function _onResizeWindow() {
+            if(this.initConfig.autoPosOnResize == 'center' && !this.dragging.wasDragged) {
+                this.setPosition();
+            } else if(this.initConfig.autoPosOnResize == 'relative' && this.windowPositionRatio) {
+                const documentGeometry = _readDocumetGeometry();
+                const newPos = {
+                    x: documentGeometry.width * this.windowPositionRatio.left - (this.getWidth() / 2),
+                    y: documentGeometry.height * this.windowPositionRatio.top - (this.getHeight() / 2),
+                };
+                this.setPosition(newPos.x, newPos.y);
+            }
+
+            if(this.initConfig.automove) {
+                _onResizeMove.call(this);
+            }
+        }
+
+        function _calcWindowPositionRatio(){
+            const documentGeometry = _readDocumetGeometry();
+            const windowCenter = {
+                left: this.getLeft() + this.getWidth() / 2,
+                top: this.getTop() + this.getHeight() / 2
+            };
+            this.windowPositionRatio = {
+                left: windowCenter.left / documentGeometry.width,
+                top: windowCenter.top / documentGeometry.height,
+            };
+        }
+
         function _onResizeMove(){
             var main_geometry = _readDocumetGeometry(),
                 main_width = main_geometry.width,
@@ -659,7 +692,7 @@ define([
                     _.each(options.buttons, function(b){
                         if (typeof(b) == 'object') {
                             if (b.value !== undefined) {
-                                var item = {value: b.value, text: b.caption, cls: 'auto' + ((b.primary || options.primary==b.value) ? ' primary' : '')};
+                                var item = {value: b.value, text: b.caption, cls: 'auto' + ((b.primary || options.primary==b.value) ? ' primary' : '') + (b.cls ? ' ' + b.cls : '')};
                                 b.id && (item.id = b.id);
                                 newBtns.push(item);
                             }
@@ -805,11 +838,13 @@ define([
                 }
 
                 $(document).on('keydown.' + this.cid, this.binding.keydown);
-                if(this.initConfig.automove){
-                    this.binding.windowresize = _.bind(_onResizeMove, this);
+                if(this.initConfig.automove || this.initConfig.autoPosOnResize != 'none'){
+                    this.binding.windowresize = _.bind(_onResizeWindow, this);
                     $(window).on('resize', this.binding.windowresize);
                 }
 
+                this.initConfig.autoPosOnResize == 'relative' && _calcWindowPositionRatio.call(this);
+
                 var me = this;
 
                 setTimeout(function () {
@@ -860,7 +895,7 @@ define([
 
             close: function(suppressevent) {
                 $(document).off('keydown.' + this.cid);
-                this.initConfig.automove && $(window).off('resize', this.binding.windowresize);
+                this.binding.windowresize && $(window).off('resize', this.binding.windowresize);
                 if ( this.initConfig.header ) {
                     this.$window.find('.header').off('mousedown', this.binding.dragStart);
                 }
@@ -908,7 +943,7 @@ define([
 
             hide: function() {
                 $(document).off('keydown.' + this.cid);
-                this.initConfig.automove && $(window).off('resize', this.binding.windowresize);
+                this.binding.windowresize && $(window).off('resize', this.binding.windowresize);
                 if (this.$window) {
                     if (this.initConfig.modal) {
                         var mask = _getMask(),

apps/common/main/lib/controller/Comments.js

@@ -712,7 +712,7 @@ define([
                 if (model) {
                     this.collection.remove(model);
                     if (!silentUpdate) {
-                        this.updateComments(true);
+                        this.updateComments(true, undefined, undefined, true);
                     }
                 }
 
@@ -940,8 +940,10 @@ define([
                     this.uids = _.clone(uids);
 
                     comments.push(comment);
-                    if (!this._dontScrollToComment)
+                    if (!this._dontScrollToComment) {
+                        this.view.commentsView.clearActive();
                         this.view.commentsView.scrollToRecord(comment);
+                    }
                     this._dontScrollToComment = false;
                 }
 
@@ -962,6 +964,8 @@ define([
         onApiHideComment: function (hint) {
             var t = this;
 
+            this.view && this.view.commentsView && this.view.commentsView.clearActive();
+
             if (this.getPopover()) {
                 if (this.isSelectedComment && hint) {
                     return;
@@ -1041,7 +1045,8 @@ define([
                     }
 
                     this.getPopover().setLeftTop(posX, posY, leftX, undefined);
-
+                    this.getPopover().moveMentions();
+                    
 //                    if (this.isSelectedComment && (0 === _.difference(this.uids, uids).length)) {
                         //NOTE: click to sdk view ?
 //                        if (this.api) {
@@ -1084,16 +1089,18 @@ define([
 
         // internal
 
-        updateComments: function (needRender, disableSort, loadText) {
+        updateComments: function (needRender, disableSort, loadText, isSaveScrollPos) {
             var me = this;
             me.updateCommentsTime = new Date();
             me.disableSort = !!disableSort;
             if (me.timerUpdateComments===undefined)
                 me.timerUpdateComments = setInterval(function(){
                     if ((new Date()) - me.updateCommentsTime>100) {
+                        const scrollPos =  me.view.commentsView.scroller.getScrollTop();
                         clearInterval(me.timerUpdateComments);
                         me.timerUpdateComments = undefined;
                         me.updateCommentsView(needRender, me.disableSort, loadText);
+                        isSaveScrollPos && me.view.commentsView.scroller.scrollTop(scrollPos);
                     }
                }, 25);
         },

apps/common/main/lib/controller/Plugins.js

@@ -315,15 +315,14 @@ define([
             this.backgroundPlugins.forEach(function (model) {
                 var modes = model.get('variations'),
                     icons = modes[model.get('currentVariation')].get('icons'),
-                    parsedIcons = me.viewPlugins.parseIcons(icons),
-                    icon_url = model.get('baseUrl') + parsedIcons['normal'],
                     guid = model.get('guid'),
                     isRun = _.indexOf(usedPlugins, guid) !== -1;
-                model.set('parsedIcons', parsedIcons);
-                var menuItem = new Common.UI.MenuItem({
+                model.set('parsedIcons', me.viewPlugins.parseIcons(icons));
+                var menuItem = new Common.UI.MenuItemCustom({
                     value: guid,
                     caption: model.get('name'),
-                    iconImg: icon_url,
+                    iconsSet: me.viewPlugins.iconsStr2IconsObj(icons),
+                    baseUrl: model.get('baseUrl'), // icons have a relative path, so need to use the base url
                     template: _.template([
                         '<div id="<%= id %>" class="menu-item" <% if(!_.isUndefined(options.stopPropagation)) { %> data-stopPropagation="true" <% } %> >',
                             '<img class="menu-item-icon" src="<%= options.iconImg %>">',

apps/common/main/lib/controller/ReviewChanges.js

@@ -167,10 +167,10 @@ define([
             }
         },
 
-        setMode: function(mode) {
+        setMode: function(mode, tabOptions) {
             this.appConfig = mode;
             this.popoverChanges = new Common.Collections.ReviewChanges();
-            this.view = this.createView('Common.Views.ReviewChanges', { mode: mode });
+            this.view = this.createView('Common.Views.ReviewChanges', { mode: mode, tabOptions: (tabOptions || {}) });
 
             if (!!this.appConfig.sharingSettingsUrl && this.appConfig.sharingSettingsUrl.length || this.appConfig.canRequestSharingSettings) {
                 Common.Gateway.on('showsharingsettings', _.bind(this.changeAccessRights, this));

apps/common/main/lib/controller/ScreenReaderFocus.js

@@ -383,6 +383,7 @@ Common.UI.ScreenReaderFocusManager = new(function() {
                     turnOffHints = true;
                     _nextItem();
                 } else if (isNextLevel) {
+                    if ($('.toolbar.folded').not('.expanded').length > 0) return;
                     var attr = '[data-hint="' + (_currentLevel + 1) + '"]';
                     if ($(_currentSection).find(attr).length === 0 || btn && $(btn.closest('.hint-section')).find(attr).filter(':visible').length === 0) return;
                     turnOffHints = true;

apps/common/main/lib/controller/Shortcuts.js

@@ -75,9 +75,9 @@ define([
                 9: 'Tab',
                 12: 'Clear',
                 13: 'Enter',
-                16: 'Shift',
-                17: 'Ctrl',
-                18: 'Alt',
+                16: Common.Utils.isMac ? '⇧' : 'Shift',
+                17: Common.Utils.isMac ? '^' : 'Ctrl',
+                18: Common.Utils.isMac ? '⌥' : 'Alt',
                 19: 'Pause',
                 20: 'CapsLock',
                 27: 'Escape',
@@ -93,7 +93,7 @@ define([
                 44: 'PrintScreen',
                 45: 'Insert',
                 46: 'Delete',
-                91: 'Meta',
+                91: Common.Utils.isMac ? '⌘' : 'Meta',
                 93: 'ContextMenu',
                 96: "Num 0",
                 97: "Num 1",
@@ -159,6 +159,7 @@ define([
                         ascShortcut: ascShortcut,
                     }
                 });
+                actionItem.shortcuts = actionItem.shortcuts.sort(this._sortComparator);
             }
 
             this._eventsTrigger();
@@ -472,6 +473,9 @@ define([
                         shortcuts[foundIndex].ascShortcut = copyAscShortcut;
                     }
                 }
+                if(this.actionsMap[actionType]) {
+                    this.actionsMap[actionType].shortcuts = shortcuts.sort(this._sortComparator);
+                }
             }
         },
 
@@ -563,10 +567,10 @@ define([
         
         _getAscShortcutKeys: function(ascShortcut) {
             const keys = [];
-            ascShortcut.asc_IsCommand() && keys.push('⌘');
-            ascShortcut.asc_IsCtrl() && keys.push('Ctrl');
-            ascShortcut.asc_IsAlt() && keys.push('Alt');
-            ascShortcut.asc_IsShift() && keys.push('Shift');
+            ascShortcut.asc_IsCommand() && keys.push(this.keyCodeToKeyName(Common.UI.Keys.META));
+            ascShortcut.asc_IsCtrl() && keys.push(this.keyCodeToKeyName(Common.UI.Keys.CTRL));
+            ascShortcut.asc_IsAlt() && keys.push(this.keyCodeToKeyName(Common.UI.Keys.ALT));
+            ascShortcut.asc_IsShift() && keys.push(this.keyCodeToKeyName(Common.UI.Keys.SHIFT));
             keys.push(this.keyCodeToKeyName(ascShortcut.asc_GetKeyCode()));
             return keys;
         },

apps/common/main/lib/controller/Themes.js

@@ -218,8 +218,6 @@ define([
             "highlight-header-button-hover",
             "highlight-header-button-pressed",
             "highlight-text-select",
-            "highlight-accent-button-hover",
-            "highlight-accent-button-pressed",
             "highlight-toolbar-tab-underline-document",
             "highlight-toolbar-tab-underline-spreadsheet",
             "highlight-toolbar-tab-underline-presentation",
@@ -234,12 +232,10 @@ define([
             "border-toolbar",
             "border-divider",
             "border-regular-control",
-            "border-toolbar-button-hover",
             "border-preview-hover",
             "border-preview-select",
             "border-control-focus",
             "border-color-shading",
-            "border-error",
             "border-contrast-popover",
 
             "text-normal",
@@ -257,10 +253,7 @@ define([
 
             "icon-normal",
             "icon-normal-pressed",
-            "icon-inverse",
             "icon-toolbar-header",
-            "icon-notification-badge",
-            "icon-contrast-popover",
             "icon-success",
 
             "canvas-background",
@@ -277,7 +270,6 @@ define([
             "canvas-high-contrast",
             "canvas-high-contrast-disabled",
 
-            "canvas-cell-border",
             "canvas-cell-title-background",
             "canvas-cell-title-background-hover",
             "canvas-cell-title-background-selected",
@@ -292,8 +284,6 @@ define([
             "canvas-dark-cell-title-border",
             "canvas-dark-cell-title-border-hover",
             "canvas-dark-cell-title-border-selected",
-            "canvas-dark-content-background",
-            "canvas-dark-page-border",
 
             "canvas-scroll-thumb",
             "canvas-scroll-thumb-hover",
@@ -313,8 +303,6 @@ define([
             "canvas-sheet-view-cell-background-pressed",
             "canvas-sheet-view-cell-title-label",
 
-            "canvas-freeze-line-1px",
-            "canvas-freeze-line-2px",
             "canvas-select-all-icon",
 
             "canvas-anim-pane-background",
@@ -610,9 +598,9 @@ define([
 
         const refresh_theme = function (force, caller) {
             if ( force || Common.localStorage.getItem('ui-theme-id') != window.uitheme.id ) {
-                const theme_id = Common.localStorage.getItem('ui-theme-id');
+                let theme_id = Common.localStorage.getItem('ui-theme-id');
 
-                if ( theme_id ) {
+                if ( theme_id && (force && (theme_id = 'theme-system')) ) {
                     apply_theme.call(this, theme_id);
                     Common.NotificationCenter.trigger('uitheme:changed', theme_id, caller);
                 }

apps/common/main/lib/template/Comments.template

@@ -1,5 +1,5 @@
 <% if (!hide && !filtered) { %>
-    <div id="<%= id %>" class="user-comment-item">
+    <div id="<%= id %>" class="user-comment-item <% if (last) { %> last-item <% } %>">
 
         <!-- comment block -->
 
@@ -121,8 +121,5 @@
             <div class="lock-area"></div>
             <div class="lock-author"><%=lockuserid%></div>
         <% } %>
-        <% if (!last) { %>
-            <div class="separator-cmt"></div>
-        <% } %>
     </div>
 <% } %>

apps/common/main/lib/util/utils.js

@@ -1393,7 +1393,7 @@ define([], function () {
             theme-type - {string} theme type (light|dark|common)
             theme-name - {string} the name of theme
             state - {string} state of icons for different situations (normal|hover|active)
-            scale - {string} list of avaliable scales (100|125|150|175|200|default|extended)
+            scale - {string} list of avaliable scales (100|125|150|175|200|default|*)
             extension - {string} use it after symbol "." (png|jpeg|svg)
 
             Example: "resources/%theme-type%(light|dark)/icon%state%(normal|hover)%scale%(default).%extension%(png)"
@@ -1560,7 +1560,7 @@ define([], function () {
                 bestUrl;
             for (var key in current) {
                 if (current.hasOwnProperty(key)) {
-                    if (key == 'default') {
+                    if (key == 'default' || key == '*') {
                         defUrl = current[key];
                     } else if (!isNaN(parseInt(key))) {
                         currentDistance = Math.abs(ratio - parseInt(key));

apps/common/main/lib/view/Comments.js

@@ -176,6 +176,9 @@ define([
                         }
                     }
                 }
+            },
+            clearActive: function() {
+                this.cmpEl && this.cmpEl.find('.item.active').removeClass('active');
             }
         }
     })());
@@ -197,6 +200,9 @@ define([
                 me.update();
             }
 
+            picker.clearActive();
+            item.$el && item.$el.addClass('active');
+
             btn = $(e.target);
             if (btn) {
                 showEditBox = record.get('editText');
@@ -231,9 +237,11 @@ define([
                             me.hookTextBox();
                         }
                     }
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-delete')) {
                     if (!_.isUndefined(replyId)) {
                         me.fireEvent('comment:removeReply', [commentId, replyId]);
+                        me.fireEvent('comment:show', [commentId, false]);
                     } else {
                         me.fireEvent('comment:remove', [commentId]);
                         Common.NotificationCenter.trigger('edit:complete', me);
@@ -252,6 +260,7 @@ define([
 
                     picker.autoScrollToEditButtons();
                     picker.setFocusToTextBox();
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-reply', false)) {
                     if (showReplyBox) {
                         me.fireEvent('comment:addReply', [commentId, picker.getActiveTextBoxVal()]);
@@ -259,10 +268,11 @@ define([
 
                         readdresolves();
                     }
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-close', false)) {
 
                     me.fireEvent('comment:closeEditing', [commentId]);
-
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-inner-edit', false)) {
                     if (!_.isUndefined(me.commentsView.reply)) {
                         me.fireEvent('comment:changeReply', [commentId, me.commentsView.reply, picker.getActiveTextBoxVal()]);
@@ -274,13 +284,14 @@ define([
                     me.fireEvent('comment:closeEditing');
 
                     readdresolves();
-
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-inner-close', false)) {
                     me.fireEvent('comment:closeEditing');
 
                     me.commentsView.reply = undefined;
 
                     readdresolves();
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (btn.hasClass('btn-resolve', false)) {
                     var tip = btn.data('bs.tooltip');
                     if (tip) tip.dontShow = true;
@@ -288,6 +299,7 @@ define([
                     me.fireEvent('comment:resolve', [commentId]);
 
                     readdresolves();
+                    me.fireEvent('comment:show', [commentId, false]);
                 } else if (!btn.hasClass('msg-reply') &&
                     !btn.hasClass('btn-resolve')) {
                     var isTextSelected = false;

apps/common/main/lib/view/Header.js

@@ -1197,7 +1197,7 @@ define([
                 this.fileExtention = idx>0 ? this.documentCaption.substring(idx) : '';
                 this.isModified && (value += '*');
                 this.readOnly && (value += ' (' + this.textReadOnly + ')');
-                if ( $labelDocName ) {
+                if ( $labelDocName && !this.withoutExt ) {
                     this.setDocTitle( value );
                 }
                 return value;

apps/common/main/lib/view/OpenDialog.js

@@ -67,7 +67,7 @@ define([
             }, options);
 
             this.txtOpenFile = options.txtOpenFile || this.txtOpenFile;
-
+            this.isTSV = options.isTSV || false;
             this.template = options.template || [
                 '<div class="box">',
                     '<div class="content-panel" >',
@@ -106,9 +106,39 @@ define([
                         '<% if (type == Common.Utils.importTextType.Paste || type == Common.Utils.importTextType.Columns || type == Common.Utils.importTextType.Data) { %>',
                         '<div style="display: inline-block; <% if (codepages && codepages.length>0) { %>margin-top:15px;<% } %>width: 100%;">',
                             '<label class="header">' + t.txtDelimiter + '</label>',
-                            '<div>',
-                                '<div id="id-delimiters-combo" class="input-group-nr" style="max-width: 100px;display: inline-block; vertical-align: middle;"></div>',
-                                '<div id="id-delimiter-other" class="input-row margin-left-10" style="display: inline-block; vertical-align: middle;"></div>',
+                            '<div class="controll-panel <% if (type == Common.Utils.importTextType.Paste || type == Common.Utils.importTextType.Columns) { %>margin-top<% } %>">',
+                                '<% if (type == Common.Utils.importTextType.Paste || type == Common.Utils.importTextType.Columns) { %>',
+                                    '<table id="id-delimiters-table">',
+                                        '<tr>',
+                                            '<td>',
+                                                '<div id="id-delimiter-chk-comma"></div>',
+                                            '</td>',
+                                            '<td>',
+                                                '<div id="id-delimiter-chk-tab"></div>',
+                                            '</td>',
+                                        '</tr>',
+                                        '<tr>',
+                                            '<td>',
+                                                '<div id="id-delimiter-chk-semicolon"></div>',
+                                            '</td>',
+                                            '<td>',
+                                                '<div id="id-delimiter-chk-space"></div>',
+                                            '</td>',
+                                        '</tr>',
+                                        '<tr>',
+                                            '<td>',
+                                                '<div id="id-delimiter-chk-colon"></div>',
+                                            '</td>',    
+                                            '<td id="id-delimiter-other-row">',
+                                                '<div id="id-delimiter-chk-other"></div>',
+                                                '<div id="id-delimiter-other"></div>',
+                                            '</td>',
+                                        '</tr>',
+                                    '</table>',
+                                '<% } else { %>',
+                                    '<div id="id-delimiters-combo" class="input-group-nr" style="max-width: 100px;display: inline-block; vertical-align: middle;"></div>',
+                                    '<div id="id-delimiter-other" class="input-row margin-left-10" style="display: inline-block; vertical-align: middle;"></div>',
+                                '<% } %>',
                                 '<button type="button" class="btn auto btn-text-default float-right" id="id-delimiters-advanced" style="min-width:100px; display: inline-block;">' + t.txtAdvanced + '</button>',
                             '</div>',
                         '</div>',
@@ -214,6 +244,7 @@ define([
             this.inputPwd && arr.push(this.inputPwd);
             this.cmbEncoding && arr.push(this.cmbEncoding);
             this.cmbDelimiter && arr.push(this.cmbDelimiter);
+            this.delimiterCheckboxes && (arr = arr.concat(this.delimiterCheckboxes.map(function(i) { return i.cmp; })));
             this.inputDelimiter && arr.push(this.inputDelimiter);
             this.btnAdvanced && arr.push(this.btnAdvanced);
             this.txtDestRange && arr.push(this.txtDestRange);
@@ -225,16 +256,20 @@ define([
             Common.UI.Window.prototype.show.apply(this, arguments);
 
             var me = this;
-             if (this.type == Common.Utils.importTextType.DRM) {
-                 setTimeout(function(){
-                     me.inputPwd.focus();
-                     if (me.validatePwd)
-                         me.inputPwd.checkValidate();
-                 }, 500);
-             } else {
-                 var cmp = me.txtDestRange ? me.txtDestRange : (me.cmbEncoding ? me.cmbEncoding : me.cmbDelimiter);
-                 cmp && setTimeout(function(){cmp.focus();}, 500);
-             }
+            if (this.type == Common.Utils.importTextType.DRM) {
+                setTimeout(function(){
+                    me.inputPwd.focus();
+                    if (me.validatePwd)
+                        me.inputPwd.checkValidate();
+                }, 500);
+            } else {
+                var cmp = me.txtDestRange || null;
+                (!cmp && me.cmbEncoding) && (cmp = me.cmbEncoding); 
+                (!cmp && me.cmbDelimiter) && (cmp = me.cmbDelimiter); 
+                (!cmp && me.delimiterCheckboxes) && (cmp = me.delimiterCheckboxes[0].cmp); 
+
+                cmp && setTimeout(function(){cmp.focus();}, 500);
+            }
         },
 
         onBtnClick: function(event) {
@@ -256,25 +291,43 @@ define([
 
                     var encoding = (this.cmbEncoding && !this.cmbEncoding.isDisabled()) ? this.cmbEncoding.getValue() :
                             ((this.settings && this.settings.asc_getCodePage()) ? this.settings.asc_getCodePage() : 0),
-                        delimiter = this.cmbDelimiter ? this.cmbDelimiter.getValue() : null,
-                        delimiterChar = (delimiter == -1) ? this.inputDelimiter.getValue() : null;
-                    (delimiter == -1) && (delimiter = null);
+                        delimiters = [],
+                        delimiterChar = null;
+
+                    if(this.cmbDelimiter) {
+                        delimiters = [this.cmbDelimiter.getValue()];
+                    } else if(this.delimiterCheckboxes) {
+                        this.delimiterCheckboxes.forEach(function(checkbox) {
+                            checkbox.cmp.isChecked() && delimiters.push(checkbox.id);
+                        });
+                    }
+                    delimiterChar = delimiters.includes(-1) ? this.inputDelimiter.getValue() : null;
+
+                    const delimForSave = JSON.stringify(!delimiters.length ? [-1] : delimiters);
                     if (this.type === Common.Utils.importTextType.TXT) { //save last encoding only for txt files
                         this._isEncodingChanged && Common.localStorage.setItem("de-settings-open-encoding", encoding);
                     } else if (this.type === Common.Utils.importTextType.CSV) { // only for csv files
-                        this._isDelimChanged && Common.localStorage.setItem("sse-settings-csv-delimiter", delimiter === null ? -1 : delimiter);
-                        this._isDelimCharChanged && Common.localStorage.setItem("sse-settings-csv-delimiter-char", delimiterChar || '');
+                        this._isDelimChanged && Common.localStorage.setItem("sse-settings-csv-delimiter", delimForSave);
+                        this._isDelimCharChanged && Common.localStorage.setItem("sse-settings-csv-delimiter-char", 
+                            delimiterChar || ''
+                        );
                         this._isEncodingChanged && Common.localStorage.setItem("sse-settings-csv-encoding", encoding);
-                    } else if (this.type === Common.Utils.importTextType.Paste || this.type === Common.Utils.importTextType.Columns || this.type === Common.Utils.importTextType.Data) {
-                        this._isDelimChanged && Common.localStorage.setItem("sse-settings-data-delimiter", delimiter === null ? -1 : delimiter);
-                        this._isDelimCharChanged && Common.localStorage.setItem("sse-settings-data-delimiter-char", delimiterChar || '');
+                    } else if (this.type === Common.Utils.importTextType.Paste || 
+                        this.type === Common.Utils.importTextType.Columns || 
+                        this.type === Common.Utils.importTextType.Data
+                    ) {
+                        this._isDelimChanged && Common.localStorage.setItem("sse-settings-data-delimiter", delimForSave);
+                        this._isDelimCharChanged && Common.localStorage.setItem("sse-settings-data-delimiter-char", 
+                            delimiterChar || ''
+                        );
                         this._isEncodingChanged && Common.localStorage.setItem("sse-settings-data-encoding", encoding);
                     }
+                    delimiters = delimiters.filter(function(el) { return el != -1; });
 
                     var decimal = this.separatorOptions ? this.separatorOptions.decimal : undefined,
                         thousands = this.separatorOptions ? this.separatorOptions.thousands : undefined,
                         qualifier = this.separatorOptions ? this.separatorOptions.qualifier : '"';
-                    var options = new Asc.asc_CTextOptions(encoding, delimiter, delimiterChar);
+                    var options = new Asc.asc_CTextOptions(encoding, delimiters, delimiterChar);
                     decimal && options.asc_setNumberDecimalSeparator(decimal);
                     thousands && options.asc_setNumberGroupSeparator(thousands);
                     qualifier && options.asc_setTextQualifier(qualifier);
@@ -366,38 +419,119 @@ define([
             }
 
             if (this.type == Common.Utils.importTextType.CSV || this.type == Common.Utils.importTextType.Paste || this.type == Common.Utils.importTextType.Columns || this.type == Common.Utils.importTextType.Data) {
-                var delimiter = '',
+                var delimiters = [],
                     delimiterChar = '';
                 if (!this.preview) { // don't need to detect delimiter (save to csv)
-                    delimiter = this.settings && this.settings.asc_getDelimiter() ? this.settings.asc_getDelimiter() : 4,
+                    delimiters = this.settings && this.settings.asc_getDelimiter() ? this.settings.asc_getDelimiter() : [4],
                     delimiterChar = this.settings && this.settings.asc_getDelimiterChar() ? this.settings.asc_getDelimiterChar() : '';
-                    var value = Common.localStorage.getItem(this.type == Common.Utils.importTextType.CSV ? "sse-settings-csv-delimiter" : "sse-settings-data-delimiter");
-                    if (value) {
-                        value = parseInt(value);
-                        if (!isNaN(value)) {
-                            delimiter = value;
-                            (delimiter===-1) && (delimiterChar = Common.localStorage.getItem(this.type == Common.Utils.importTextType.CSV ? "sse-settings-csv-delimiter-char" : "sse-settings-data-delimiter-char") || '');
+                    let valueFromStorage = Common.localStorage.getItem(
+                        this.type == Common.Utils.importTextType.CSV
+                            ? "sse-settings-csv-delimiter"
+                            : "sse-settings-data-delimiter"
+                    );
+
+                    if (valueFromStorage) {
+                        let isDelitFromStorage = false;
+                        
+                        valueFromStorage = JSON.parse(valueFromStorage);
+                        if (Array.isArray(valueFromStorage)) {
+                            delimiters = valueFromStorage;
+                            isDelitFromStorage = true;
+                        } else {
+                            const intValue = parseInt(valueFromStorage);
+                            if(!isNaN(intValue)) {
+                                delimiters = [intValue];
+                                isDelitFromStorage = true;
+                            }
+                        }
+
+                        if(isDelitFromStorage && delimiters.includes(-1)) {
+                            const key = (this.type === Common.Utils.importTextType.CSV
+                                ? "sse-settings-csv-delimiter-char"
+                                : "sse-settings-data-delimiter-char"
+                            );
+
+                            delimiterChar = Common.localStorage.getItem(key) || '';
                         }
                     }
                 }
 
-                this.cmbDelimiter = new Common.UI.ComboBox({
-                    el: $('#id-delimiters-combo', this.$window),
-                    style: 'width: 100px;',
-                    menuStyle: 'min-width: 100px;',
-                    cls: 'input-group-nr',
-                    data: [
-                        {value: 4, displayValue: this.txtComma},
-                        {value: 2, displayValue: this.txtSemicolon},
-                        {value: 3, displayValue: this.txtColon},
-                        {value: 1, displayValue: this.txtTab},
-                        {value: 5, displayValue: this.txtSpace},
-                        {value: -1, displayValue: this.txtOther}],
-                    editable: false,
-                    takeFocusOnClose: true
-                });
-                this.cmbDelimiter.setValue(delimiter);
-                this.cmbDelimiter.on('selected', _.bind(this.onCmbDelimiterSelect, this));
+                if(this.type == Common.Utils.importTextType.Paste || this.type == Common.Utils.importTextType.Columns) {
+                    const me = this;
+                    this.delimiterCheckboxes = [
+                        {
+                            id: 4,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-comma'),
+                                labelText: this.txtComma
+                            }),
+                        },
+                        {
+                            id: 2,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-semicolon'),
+                                labelText: this.txtSemicolon
+                            })
+                        },
+                        {
+                            id: 3,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-colon'),
+                                labelText: this.txtColon
+                            })
+                        },
+                        {
+                            id: 1,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-tab'),
+                                labelText: this.txtTab
+                            })
+                        },
+                        {
+                            id: 5,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-space'),
+                                labelText: this.txtSpace
+                            })
+                        },
+                        {
+                            id: -1,
+                            cmp: new Common.UI.CheckBox({
+                                el: $('#id-delimiter-chk-other'),
+                                labelText: this.txtOther,
+                                value: -1
+                            })
+                        }
+                    ];
+                    this.delimiterCheckboxes.forEach(function(checkbox) {
+                        checkbox.cmp.on('change', function(field) {
+                            if(checkbox.id == -1) {
+                                me.inputDelimiter.setVisible(field.isChecked());
+                                field.isChecked() && setTimeout(function(){me.inputDelimiter.focus();}, 10);
+                            }
+                            me.preview && me.updatePreview();
+                            me._isDelimChanged = true;
+                        });
+                    });
+                } else {
+                    this.cmbDelimiter = new Common.UI.ComboBox({
+                        el: $('#id-delimiters-combo', this.$window),
+                        style: 'width: 100px;',
+                        menuStyle: 'min-width: 100px;',
+                        cls: 'input-group-nr',
+                        data: [
+                            {value: 4, displayValue: this.txtComma},
+                            {value: 2, displayValue: this.txtSemicolon},
+                            {value: 3, displayValue: this.txtColon},
+                            {value: 1, displayValue: this.txtTab},
+                            {value: 5, displayValue: this.txtSpace},
+                            {value: -1, displayValue: this.txtOther}],
+                        editable: false,
+                        takeFocusOnClose: true
+                    });
+                    this.cmbDelimiter.setValue(this.isTSV ? 1 : delimiters[0]);
+                    this.cmbDelimiter.on('selected', _.bind(this.onCmbDelimiterSelect, this));
+                }
 
                 this.inputDelimiter = new Common.UI.InputField({
                     el          : $('#id-delimiter-other'),
@@ -407,7 +541,7 @@ define([
                     validateOnBlur: false,
                     value: delimiterChar
                 });
-                this.inputDelimiter.setVisible(delimiter===-1);
+                this.inputDelimiter.setVisible(delimiters.includes(-1));
                 this.inputDelimiter.on ('changing', _.bind(this.onInputCharChanging, this));
 
                 if (this.type == Common.Utils.importTextType.Paste || this.type == Common.Utils.importTextType.Columns || this.type == Common.Utils.importTextType.Data) {
@@ -440,24 +574,39 @@ define([
         },
 
         textCallback: function(text) {
-            var delimiter,
+            var delimiters = [],
                 delimiterChar,
                 encoding = (this.cmbEncoding && !this.cmbEncoding.isDisabled()) ? this.cmbEncoding.getValue() :
-                           ((this.settings && this.settings.asc_getCodePage()) ? this.settings.asc_getCodePage() : 0);
-            if (this.detectedDelimiter || this.type === Common.Utils.importTextType.TXT) {
-                delimiter = this.cmbDelimiter ? this.cmbDelimiter.getValue() : null;
-                delimiterChar = delimiter == -1 ? this.inputDelimiter.getValue() : null;
+                        ((this.settings && this.settings.asc_getCodePage()) ? this.settings.asc_getCodePage() : 0);
+            
+            if (this.detectedDelimiter || this.type === Common.Utils.importTextType.TXT || this.isTSV) {
+                if(this.cmbDelimiter) {
+                    delimiters = [this.cmbDelimiter.getValue()];
+                } else if(this.delimiterCheckboxes) {
+                    this.delimiterCheckboxes.forEach(function(checkbox) {
+                        checkbox.cmp.isChecked() && delimiters.push(checkbox.id);
+                    });
+                }
+                delimiterChar = delimiters.includes(-1) ? this.inputDelimiter.getValue() : '';
             } else {
                 var res = this.api.asc_getCSVDelimiter(text);
                 text = res.text;
-                delimiter = res.delimiter || -1;
-                delimiterChar = delimiter===-1 ? res.delimiterChar || '' : '';
-                this.cmbDelimiter.setValue(delimiter);
-                this.inputDelimiter.setVisible(delimiter===-1);
+                delimiters = [res.delimiter || -1];
+                delimiterChar = delimiters.includes(-1) ? res.delimiterChar || '' : '';
+                if(this.cmbDelimiter) {
+                    this.cmbDelimiter.setValue(delimiters[0]);
+                } else if(this.delimiterCheckboxes) {
+                    this.delimiterCheckboxes.forEach(function(checkbox) {
+                        checkbox.cmp.setValue(delimiters.includes(checkbox.id), true);
+                    });
+                }
+                this.inputDelimiter.setVisible(delimiters.includes(-1));
                 this.inputDelimiter.setValue(delimiterChar);
                 this.detectedDelimiter = true;
             }
-            var options = new Asc.asc_CTextOptions(encoding, delimiter, delimiterChar);
+            
+            delimiters = delimiters.filter(function(el) { return el != -1; });
+            var options = new Asc.asc_CTextOptions(encoding, delimiters, delimiterChar);
             if (this.separatorOptions) {
                 options.asc_setNumberDecimalSeparator(this.separatorOptions.decimal);
                 options.asc_setNumberGroupSeparator(this.separatorOptions.thousands);
@@ -512,7 +661,7 @@ define([
                         maxlength = str.length;
                 }
                 this._previewTdMaxLength = Math.max(this._previewTdMaxLength, maxlength);
-                var tpl = '<table>';
+                var tpl = '<table id="id-preview-table">';
                 for (var i=0; i<data.length; i++) {
                     var str = data[i] || '';
                     tpl += '<tr style="vertical-align: top;">';
@@ -534,7 +683,7 @@ define([
                 }
                 tpl += '</table>';
             } else {
-                var tpl = '<table>';
+                var tpl = '<table id="id-preview-table">';
                 for (var i=0; i<data.length; i++) {
                     var str = data[i] || '';
                     tpl += '<tr style="vertical-align: top;"><td>' + Common.Utils.String.htmlEncode(str) + '</td></tr>';

apps/common/main/lib/view/Plugins.js

@@ -252,14 +252,6 @@ define([
                 icons = modes[model.get('currentVariation')].get('icons');
             if (icons === '') return;
             model.set('parsedIcons', this.parseIcons(icons));
-            this.updatePluginButton(model);
-        },
-
-        updatePluginButton: function(model) {
-            if (!model.get('visible') || !model.get('parsedIcons'))
-                return null;
-            var menuItem = model.get('backgroundPlugin');
-            menuItem && menuItem.cmpEl && menuItem.cmpEl.find("img").attr("src", model.get('baseUrl') + model.get('parsedIcons')['normal']);
         },
 
         createBackgroundPluginsButton: function () {

apps/common/main/lib/view/ReviewChanges.js

@@ -271,6 +271,11 @@ define([
                 Common.UI.BaseView.prototype.initialize.call(this, options);
 
                 this.appConfig = options.mode;
+                this.tabOptions = {
+                    canCommentResolve: options.tabOptions && options.tabOptions.canCommentResolve != undefined
+                        ? options.tabOptions.canCommentResolve
+                        : true
+                }
                 this.lockedControls = [];
                 var filter = Common.localStorage.getKeysFilter();
                 this.appPrefix = (filter && filter.length) ? filter.split(',')[0] : '';
@@ -499,18 +504,20 @@ define([
                         dataHintOffset: 'small'
                     });
                     this.lockedControls.push(this.btnCommentRemove);
-                    this.btnCommentResolve = new Common.UI.Button({
-                        cls: 'btn-toolbar x-huge icon-top',
-                        caption: this.txtCommentResolve,
-                        split: true,
-                        iconCls: 'toolbar__icon btn-resolve-all',
-                        lock: [_set.previewReviewMode, _set.viewFormMode, _set.hideComments, _set['Objects'], _set.lostConnect, _set.docLockView, _set.docLockForms, _set.viewMode, _set.slideMasterMode],
-                        action: 'comment-resolve',
-                        dataHint: '1',
-                        dataHintDirection: 'bottom',
-                        dataHintOffset: 'small'
-                    });
-                    this.lockedControls.push(this.btnCommentResolve);
+                    if(this.tabOptions.canCommentResolve) {
+                        this.btnCommentResolve = new Common.UI.Button({
+                            cls: 'btn-toolbar x-huge icon-top',
+                            caption: this.txtCommentResolve,
+                            split: true,
+                            iconCls: 'toolbar__icon btn-resolve-all',
+                            lock: [_set.previewReviewMode, _set.viewFormMode, _set.hideComments, _set['Objects'], _set.lostConnect, _set.docLockView, _set.docLockForms, _set.viewMode, _set.slideMasterMode],
+                            action: 'comment-resolve',
+                            dataHint: '1',
+                            dataHintDirection: 'bottom',
+                            dataHintOffset: 'small'
+                        });
+                        this.lockedControls.push(this.btnCommentResolve);
+                    }
                 }
 
                 if (this.appConfig.isEdit && this.appConfig.canCoAuthoring && this.appConfig.canUseMailMerge) {
@@ -789,11 +796,14 @@ define([
                     if ((!me.btnMailRecepients || !Common.UI.LayoutManager.isElementVisible('toolbar-collaboration-mailmerge')) && separator_last)
                         me.$el.find(separator_last).hide();
 
+//!                 NOTE: conflicted code from branch feature/pdf-history. remove if is not relevant and merge is successful
+//!                    Common.NotificationCenter.trigger('tab:visible', 'review', (window.PDFE && (config.isPDFAnnotate || config.isPDFEdit) || !window.PDFE && (config.isEdit || config.canViewReview || me.canComments))
+//!                                                                                && Common.UI.LayoutManager.isElementVisible('toolbar-collaboration'));
                     var visible = (config.isEdit || config.canViewReview || me.canComments) && Common.UI.LayoutManager.isElementVisible('toolbar-collaboration');
                     Common.NotificationCenter.trigger('tab:visible', 'review', visible);
                     if (Common.Utils.InternalSettings.get('toolbar-active-tab') && visible) { // collaboration tab has hign priority in view mode
                         Common.Utils.InternalSettings.set('toolbar-active-tab', null);
-                        Common.NotificationCenter.trigger('tab:set-active', 'review');
+                        Common.NotificationCenter.trigger('tab:set-active', 'review', true);
                     }
                     setEvents.call(me);
                 });

apps/common/main/lib/view/ReviewPopover.js

@@ -93,7 +93,7 @@ define([
                         '<div id="id-review-popover"></div>',
                         '<div id="id-comments-popover"></div>',
                     '</div>',
-                    '<div id="id-comments-arrow" class="comments-arrow"></div>',
+                    //'<div id="id-comments-arrow" class="comments-arrow"></div>',
                     '</div>'
                 ].join('');
 
@@ -678,6 +678,7 @@ define([
                 this.handlerHide();
             }
             this.hideTips();
+            this.hideMentions();
             this._state.commentsVisible = false;
             if (!this._state.reviewVisible)
                 this.hide();
@@ -704,6 +705,7 @@ define([
             }
 
             this.hideTips();
+            this.hideMentions();
 
             Common.UI.Window.prototype.hide.call(this);
 
@@ -768,10 +770,9 @@ define([
             if (commentsView && arrowView && editorView && editorView.get(0)) {
                 editorBounds = Common.Utils.getBoundingClientRect(editorView.get(0));
                 if (editorBounds) {
-                    editorBounds.height = Math.min(editorBounds.height, Math.max(300, editorBounds.height * 0.75));
                     sdkBoundsHeight = editorBounds.height - this.sdkBounds.padding * 2;
 
-                    this.$window.css({maxHeight: sdkBoundsHeight + 'px'});
+                    this.$window.css({maxHeight: (Math.min(editorBounds.height, Math.max(300, editorBounds.height * 0.75)) - this.sdkBounds.padding * 2) + 'px'});
 
                     this.sdkBounds.width = this.sdkBounds.outerWidth = editorBounds.width;
                     this.sdkBounds.height = this.sdkBounds.outerHeight = editorBounds.height;
@@ -911,10 +912,10 @@ define([
                     if (editorView && editorView.get(0)) {
                         editorBounds = Common.Utils.getBoundingClientRect(editorView.get(0));
                         if (editorBounds) {
-                            editorBounds.height = Math.min(editorBounds.height, Math.max(300, editorBounds.height * 0.75));
                             sdkBoundsHeight = editorBounds.height - this.sdkBounds.padding * 2;
                             sdkBoundsTopPos = sdkBoundsTop;
                             windowHeight = this.$window.outerHeight();
+                            var maxWindowHeight = Math.min(editorBounds.height, Math.max(300, editorBounds.height * 0.75)) - this.sdkBounds.padding * 2;
 
                             // TOP CORNER
 
@@ -929,10 +930,17 @@ define([
                                 }
                             }
 
-                            outerHeight = Math.max(commentsView.outerHeight(), this.$window.outerHeight());
+                            outerHeight = Math.max(commentsView.outerHeight(), windowHeight);
 
                             var movePos = this.isOverCursor();
                             if (movePos) {
+                                if (Math.ceil(maxWindowHeight) <= Math.ceil(outerHeight)) {
+                                    this.$window.css({
+                                        maxHeight: maxWindowHeight + 'px'
+                                    });
+                                    commentsView.css({height: maxWindowHeight - 3 + 'px'});
+                                    outerHeight = maxWindowHeight;
+                                }
                                 var leftPos = parseInt(this.$window.css('left')) - this.arrow.width,
                                     newTopDown = movePos[1][1] + sdkPanelHeight + this.arrow.width,// try move down
                                     newTopUp = movePos[0][1] + sdkPanelHeight - this.arrow.width, // try move up
@@ -970,40 +978,30 @@ define([
                                 arrowView.toggleClass('top', isMoveDown);
                                 arrowView.toggleClass('bottom', !isMoveDown);
                                 arrowView.removeClass('left right');
-                            } else if (Math.ceil(sdkBoundsHeight) <= Math.ceil(outerHeight)) {
-                                this.$window.css({
-                                    maxHeight: sdkBoundsHeight - sdkPanelHeight + 'px',
-                                    top: sdkBoundsTop + sdkPanelHeight + 'px'
-                                });
-
-                                commentsView.css({height: sdkBoundsHeight - sdkPanelHeight - 3 + 'px'});
-
-                                // arrowPosY = Math.max(this.arrow.margin, this.arrowPosY - sdkPanelHeight - this.arrow.width);
-                                arrowPosY = Math.min(arrowPosY, sdkBoundsHeight - (sdkPanelHeight + this.arrow.margin + this.arrow.height));
-
-                                arrowView.css({top: arrowPosY + 'px', left: ''});
-                                arrowView.removeClass('top bottom right left');
-                                arrowView.addClass(this._state.arrowCls);
-                                this.scroller.scrollTop(scrollPos);
                             } else {
+                                if (Math.ceil(maxWindowHeight) <= Math.ceil(outerHeight)) {
+                                    this.$window.css({
+                                        maxHeight: maxWindowHeight + 'px'
+                                    });
+                                    commentsView.css({height: maxWindowHeight - 3 + 'px'});
+                                    outerHeight = maxWindowHeight;
 
-                                outerHeight = windowHeight;
-
+                                } else
+                                    outerHeight = windowHeight;
                                 if (outerHeight > 0) {
                                     if (contentBounds.top + outerHeight > sdkBoundsHeight + sdkBoundsTop || contentBounds.height === 0) {
                                         topPos = Math.min(sdkBoundsTop + sdkBoundsHeight - outerHeight, this.arrowPosY + sdkBoundsTop - this.arrow.height);
                                         topPos = Math.max(topPos, sdkBoundsTopPos);
-
                                         this.$window.css({top: topPos + 'px'});
                                     }
                                 }
-
                                 arrowPosY = Math.max(this.arrow.margin, this.arrowPosY - (sdkBoundsHeight - outerHeight) - this.arrow.height);
                                 arrowPosY = Math.min(arrowPosY, outerHeight - this.arrow.margin - this.arrow.height);
 
                                 arrowView.css({top: arrowPosY + 'px', left: ''});
                                 arrowView.removeClass('top bottom right left');
                                 arrowView.addClass(this._state.arrowCls);
+                                this.scroller.scrollTop(scrollPos);
                             }
                         }
                     }
@@ -1171,10 +1169,29 @@ define([
                         });
                     }
                 }, this);
+        },
+
+        hideMentions: function () {
             if (this.emailMenu && this.emailMenu.rendered)
                 this.emailMenu.cmpEl.css('display', 'none');
         },
 
+        moveMentions: function () {
+            var menu = this.emailMenu;
+            if (menu && menu.rendered && menu.isVisible() && this.commentsView) {
+                var menuContainer = this.$window.find(Common.Utils.String.format('#menu-container-{0}', menu.id)),
+                    textbox = this.commentsView.getTextBox(),
+                    textboxDom = textbox ? textbox[0] : null,
+                    showPoint = textboxDom ? [textboxDom.offsetLeft, textboxDom.offsetTop + textboxDom.clientHeight + 3] : [0, 0];
+
+                menuContainer.css({left: showPoint[0], top : showPoint[1]});
+                menu.menuAlignEl = textbox;
+                menu.show();
+                menu.cmpEl.css('display', '');
+                menu.alignPosition('bl-tl', -5);
+            }
+        },
+
         isCommentsViewMouseOver: function () {
             return this._isMouseOver;
         },

apps/common/main/lib/view/SearchBar.js

@@ -76,10 +76,11 @@ define([
 
             this.options.tpl = _.template(this.template)(this.options);
             this.iconType = this.options.iconType;
+            this.mode = options.editMode;
             Common.UI.Window.prototype.initialize.call(this, this.options);
 
             Common.NotificationCenter.on('layout:changed', _.bind(this.onLayoutChanged, this));
-            Common.NotificationCenter.on('pdf:mode-apply', _.bind(this.onModeChanged, this));
+            Common.NotificationCenter.on('pdf:mode-changed', _.bind(this.onModeChanged, this));
             $(window).on('resize', _.bind(this.onLayoutChanged, this));
         },
 
@@ -169,8 +170,8 @@ define([
                 this.updateResultsNumber(resultNumber, allResults);
             }, this));
 
-            this.btnOpenPanelRedact && this.btnOpenPanelRedact.setVisible(this.mode === 'edit')
-
+            this.btnOpenPanelRedact && this.btnOpenPanelRedact.setVisible(this.mode === 'edit');
+            this.btnOpenPanel && this.btnOpenPanel.setVisible(this.mode !== 'edit');
             return this;
         },
 
@@ -219,8 +220,9 @@ define([
             this.$window.css({left: left, top: top});
         },
 
-        onModeChanged: function (mode) {
-            this.mode = mode;
+        onModeChanged: function (config) {
+            if (!config) return;
+            this.mode = config.isPDFEdit ? 'edit' : (config.isPDFAnnotate ? 'comment' : 'view');
             this.btnOpenPanel.setVisible(this.mode !== 'edit')
             this.btnOpenPanelRedact.setVisible(this.mode == 'edit')
         },

apps/common/main/lib/view/SearchPanel.js

@@ -193,7 +193,7 @@ define([
                     dataHintOffset: 'medium'
                 });
                 this.buttonRedactSearch.on('click', _.bind(function() {
-                    this.fireEvent('search:showredact');
+                    this.fireEvent('search:showredact', [true]);
                 }, this));
 
                 this.$resultsContainer = $('#search-results');
@@ -207,7 +207,7 @@ define([
                 });
 
                 Common.NotificationCenter.on('search:updateresults', _.bind(this.disableNavButtons, this));
-                Common.NotificationCenter.on('pdf:mode-apply', _.bind(this.onModeChanged, this));
+                Common.NotificationCenter.on('pdf:mode-changed', _.bind(this.onModeChanged, this));
 
                 if (window.SSE) {
                     this.cmbWithin = new Common.UI.ComboBox({
@@ -451,11 +451,10 @@ define([
             this.fireEvent('search:'+action, [this.inputText.getValue()]);
         },
 
-        onModeChanged: function (isEdit) {
-            if (isEdit !== 'edit') {
-                Common.NotificationCenter.trigger('search:resetmode');
-            }
-            this.$el.find('.redact-no-replace-btn')[this.mode === 'no-replace' && isEdit === 'edit' ? 'show' : 'hide']();
+        onModeChanged: function (config) {
+            var isEdit = config && config.isPDFEdit;
+            !isEdit && Common.NotificationCenter.trigger('search:resetmode');
+            this.$el.find('.redact-no-replace-btn')[this.mode === 'no-replace' && isEdit ? 'show' : 'hide']();
         },
 
         getSettings: function() {

apps/common/main/lib/view/ShortcutsEditDialog.js

@@ -290,7 +290,7 @@ define([
 
                     const forbiddensKeys = [Common.UI.Keys.ESC, Common.UI.Keys.TAB];
                     if(!Common.Utils.isMac) {
-                        forbiddensKeys.push(91);        //Meta (Super, Win)
+                        forbiddensKeys.push(Common.UI.Keys.META);        //Meta (Super, Win)
                     }
 
                     if (forbiddensKeys.includes(e.keyCode)) {
@@ -313,14 +313,13 @@ define([
 
                     const keys = [];
 
-                    if (e.ctrlKey) keys.push('Ctrl');
-                    if (e.shiftKey) keys.push('Shift');
-                    if (e.altKey) keys.push('Alt');
-                    if (e.metaKey && Common.Utils.isMac) keys.push('⌘');
+                    if (e.metaKey && Common.Utils.isMac) keys.push(me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.META));
+                    if (e.ctrlKey) keys.push(me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.CTRL));
+                    if (e.altKey) keys.push(me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.ALT));
+                    if (e.shiftKey) keys.push(me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.SHIFT));
 
-                    if (![Common.UI.Keys.CTRL, Common.UI.Keys.SHIFT, Common.UI.Keys.ALT, 91].includes(e.keyCode)) {
-                        const app = (window.DE || window.PE || window.SSE || window.PDFE || window.VE);
-                        keys.push(app.getController('Common.Controllers.Shortcuts').keyCodeToKeyName(e.keyCode));
+                    if (![Common.UI.Keys.CTRL, Common.UI.Keys.SHIFT, Common.UI.Keys.ALT, Common.UI.Keys.META].includes(e.keyCode)) {
+                        keys.push(me._shortcutsController.keyCodeToKeyName(e.keyCode));
                         ascShortcut.asc_SetKeyCode(e.keyCode);
                     } else {
                         ascShortcut.asc_SetKeyCode(null);
@@ -337,7 +336,12 @@ define([
 
 
                 const removeKeysIfOnlyModifiers = function(removedKeys) {
-                    const modifierKeys = ['Ctrl', 'Shift', 'Alt', '⌘'];
+                    const modifierKeys = [
+                        me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.CTRL),
+                        me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.SHIFT),
+                        me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.ALT),
+                        me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.META)
+                    ];
                     const keys = item.get('keys');
                     const hasExtra = _.some(keys, function(k) {
                         return !_.contains(modifierKeys, k);
@@ -355,10 +359,10 @@ define([
 
                 $keysInput.on('keyup', function(e) {
                     const modifierKeyMap = {
-                        [Common.UI.Keys.CTRL]: 'Ctrl',
-                        [Common.UI.Keys.ALT]: 'Alt',
-                        [Common.UI.Keys.SHIFT]: 'Shift',
-                        91: '⌘'
+                        [Common.UI.Keys.CTRL]: me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.CTRL),
+                        [Common.UI.Keys.ALT]: me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.ALT),
+                        [Common.UI.Keys.SHIFT]: me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.SHIFT),
+                        [Common.UI.Keys.META]: me._shortcutsController.keyCodeToKeyName(Common.UI.Keys.META)
                     };
                     const modifierKey = modifierKeyMap[e.keyCode];
                     removeKeysIfOnlyModifiers(modifierKey ? [modifierKey] : []);

apps/common/main/resources/img/toolbar/2.5x/btn-background-plugins.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="none" viewBox="0 0 28 28">
+    <path fill="#444" d="M21 16a5 5 0 0 1 0 10H7a5 5 0 0 1 0-10zm-1 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6M8 4a3 3 0 1 1 0 6 3 3 0 0 1 0-6"/>
+    <path fill="#444" d="M21 2a5 5 0 0 1 0 10H7l-.257-.007a5 5 0 0 1 0-9.986L7 2zM7 3a4 4 0 1 0 0 8h14a4 4 0 0 0 0-8z"/>
+</svg>

apps/common/main/resources/img/toolbar/2.5x/btn-zoom-100.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M5 17h10v-2h1v3H4v-3h1zM5 6.5V14H4V7.707l-1.5 1.5-.707-.707 2.353-2.354zm6 7.5H6V6h5zm-4-1h3V7H7zm10 1h-5V6h5zm-4-1h3V7h-3zm3-8h-1V2.996H5V5H4V1.996h12z" fill="#000"/>
+</svg>

apps/common/main/resources/img/toolbar/v2/2.5x/btn-zoom-100.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" fill="none">
+    <path d="M6.5 6.5V5.496a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1V6.5m-11 11v1a1 1 0 0 0 1 1h9a1 1 0 0 0 1-1v-1" class="icon-stroke-gray-primary"/>
+    <path d="M6.5 15.5v-7l-2 2m12 5a2 2 0 0 1-2-2v-3a2 2 0 1 1 4 0v3a2 2 0 0 1-2 2Zm-6 0a2 2 0 0 1-2-2v-3a2 2 0 1 1 4 0v3a2 2 0 0 1-2 2Z" class="icon-stroke-blue-primary"/>
+</svg>

apps/common/main/resources/less/about.less

@@ -30,6 +30,7 @@
         font: 15px Tahoma;
         color: @text-tertiary-ie;
         color: @text-tertiary;
+        user-select: text;
     }
 
     .asc-about-companyname {
@@ -37,6 +38,7 @@
         letter-spacing: 0.01em;
         color: @text-normal-ie;
         color: @text-normal;
+        user-select: text;
     }
 
     label {
@@ -47,6 +49,7 @@
             .font-size-medium();
             color: @text-normal-ie;
             color: @text-normal;
+            user-select: text;
         }
 
         &.asc-about-desc-name {
@@ -66,6 +69,7 @@
         .font-size-medium();
         color: @text-normal-ie;
         color: @text-normal;
+        user-select: text;
     }
 
     .separator.horizontal {

apps/common/main/resources/less/checkbox.less

@@ -36,7 +36,6 @@
                 box-shadow: inset 0 0 0 @scaled-one-px-value-ie @chb-border-normal-ie;
                 box-shadow: inset 0 0 0 @scaled-one-px-value @chb-border-normal;
                 pointer-events: none;
-                z-index: 1;
             }
 
             svg {

apps/common/main/resources/less/colors-table-classic.less

@@ -33,8 +33,6 @@
         --highlight-button-pressed-hover: #7d858c;
         --highlight-primary-dialog-button-hover: #666d73;
         --highlight-primary-dialog-button-pressed: var(--highlight-primary-dialog-button-hover);
-        --highlight-accent-button-hover: #375478;
-        --highlight-accent-button-pressed: #293f59;
         --highlight-header-button-hover: fade(#000, 15%);
         --highlight-header-button-pressed: fade(#000, 25%);
         --highlight-text-select: #3494fb;
@@ -58,18 +56,16 @@
         --border-toolbar-active-tab: var(--background-toolbar);
         --border-divider: #cbcbcb;
         --border-regular-control: #cfcfcf;
-        --border-toolbar-button-hover: #d8dadc;
         --border-preview-hover: #cfcfcf;
         --border-preview-select: #848484;
         --border-control-focus: #848484;
         --border-color-shading: fade(#000, 20%);
-        --border-error: #d9534f;
         --border-contrast-popover: #fff;
         --border-button-pressed-focus: #444444;
 
         --text-normal: #444;
         --text-normal-pressed: #fff;
-        --text-secondary: #a5a5a5;
+        --text-secondary: #757575;
         --text-tertiary: #a5a5a5;
         --text-link: #445799;
         --text-link-hover: #445799;
@@ -82,10 +78,7 @@
 
         --icon-normal: #444;
         --icon-normal-pressed: #fff;
-        --icon-inverse: #444;
         --icon-toolbar-header: #fff;
-        --icon-notification-badge: #000;
-        --icon-contrast-popover: #fff;
         --icon-success: #5b9f27;
 
         // Canvas
@@ -104,7 +97,6 @@
         --canvas-high-contrast: #000;
         --canvas-high-contrast-disabled: #82878f;
 
-        --canvas-cell-border: fade(#000, 10%);
         --canvas-cell-title-text: #444;
         --canvas-cell-title-background: #f1f1f1;
         --canvas-cell-title-background-hover: #d6d6d6;
@@ -139,8 +131,6 @@
         --canvas-sheet-view-cell-title-label: #121212;
         --canvas-sheet-view-select-all-icon: #3d664e;
 
-        --canvas-freeze-line-1px: #818181;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #82878f;
 
         --canvas-anim-pane-background: #f1f1f1;
@@ -234,6 +224,9 @@
         --toolbar-preferred-tab-style: fill;
         --border-editor-sdk: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
 
+        --highlight-comment-hover: #E0E0E0;
+        --highlight-comment-pressed: #D3D5D7;
+
         //--rb-background-normal: var(--background-normal);
         //--rb-background-normal-hover: var(--background-normal);
         //--rb-background-checked: var(--background-normal);

apps/common/main/resources/less/colors-table-dark-contrast.less

@@ -34,8 +34,6 @@
         --highlight-button-pressed-hover: #828282;
         --highlight-primary-dialog-button-hover: #a6a6a6;
         --highlight-primary-dialog-button-pressed: var(--highlight-primary-dialog-button-hover);
-        --highlight-accent-button-hover: #75a2d6;
-        --highlight-accent-button-pressed: #89afdc;
         --highlight-header-button-hover: fade(#fff, 20%);
         --highlight-header-button-pressed: fade(#fff, 35%);
         --highlight-text-select: #96c8fd;
@@ -47,12 +45,10 @@
         --border-toolbar-active-panel-top: var(--border-toolbar);
         --border-toolbar-active-tab: var(--border-toolbar);
         --border-regular-control: #696969;
-        --border-toolbar-button-hover: #616161;
         --border-preview-hover: #828282;
         --border-preview-select: #888;
         --border-control-focus: #b8b8b8;
         --border-color-shading: fade(#fff, 15%);
-        --border-error: #f62211;
         --border-contrast-popover: #616161;
         --border-button-pressed-focus: #b8b8b8;
 
@@ -71,10 +67,7 @@
 
         --icon-normal: #e8e8e8;
         --icon-normal-pressed: #e8e8e8;
-        --icon-inverse: #2a2a2a;
         --icon-toolbar-header: #d0d0d0;
-        --icon-notification-badge: #121212;
-        --icon-contrast-popover: #fff;
         --icon-success: #090;
 
         --highlight-header-tab-underline-document: var(--text-toolbar-header);
@@ -105,7 +98,6 @@
         --canvas-high-contrast: #c3c3c3;
         --canvas-high-contrast-disabled: #7d7d7d;
 
-        --canvas-cell-border: #656565;
         --canvas-cell-title-text: #e8e8e8;
         --canvas-cell-title-background: #1d1d1d;
         --canvas-cell-title-background-hover: #303030;
@@ -140,8 +132,6 @@
         --canvas-sheet-view-cell-title-label: #121212;
         --canvas-sheet-view-select-all-icon: #3d664e;
 
-        --canvas-freeze-line-1px: #818184;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #7d7d7d;
 
         --canvas-anim-pane-background: #2a2a2a;
@@ -235,6 +225,9 @@
         --toolbar-preferred-tab-style: fill;
         --border-editor-sdk: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
 
+        --highlight-comment-hover: #3A3A3A;
+        --highlight-comment-pressed: #5B5B5B;
+
         //--rb-background-normal: var(--background-normal);
         //--rb-background-normal-hover: var(--background-normal);
         //--rb-background-checked: var(--background-normal);

apps/common/main/resources/less/colors-table-dark.less

@@ -35,8 +35,6 @@
         --highlight-button-pressed-hover: #808080;
         --highlight-primary-dialog-button-hover: #fcfcfc;
         --highlight-primary-dialog-button-pressed: var(--highlight-primary-dialog-button-hover);
-        --highlight-accent-button-hover: #75a2d6;
-        --highlight-accent-button-pressed: #89afdc;
         --highlight-header-button-hover: fade(#fff, 15%);
         --highlight-header-button-pressed: fade(#fff, 25%);
         --highlight-text-select: #96c8fd;
@@ -48,12 +46,10 @@
         --border-toolbar-active-tab: var(--background-toolbar);
         --border-divider: #505050;
         --border-regular-control: #666;
-        --border-toolbar-button-hover: #5a5a5a;
         --border-preview-hover: #757575;
         --border-preview-select: #bdbdbd;
         --border-control-focus: #ccc;
         --border-color-shading: fade(#fff, 10%);
-        --border-error: #f62211;
         --border-contrast-popover: #666;
         --border-button-pressed-focus: #ccc;
 
@@ -72,10 +68,7 @@
 
         --icon-normal: fade(#fff, 80%);
         --icon-normal-pressed: fade(#fff, 80%);
-        --icon-inverse: #444;
         --icon-toolbar-header: fade(#fff, 80%);
-        --icon-notification-badge: #000;
-        --icon-contrast-popover: #fff;
         --icon-success: #090;
 
         --highlight-header-tab-underline-document: var(--text-toolbar-header);
@@ -106,7 +99,6 @@
         --canvas-high-contrast: #fff;
         --canvas-high-contrast-disabled: #ccc;
 
-        --canvas-cell-border: fade(#000, 10%);
         --canvas-cell-title-text: #d9d9d9;
         --canvas-cell-title-background: #555;
         --canvas-cell-title-background-hover: #787878;
@@ -141,8 +133,6 @@
         --canvas-sheet-view-cell-title-label: #121212;
         --canvas-sheet-view-select-all-icon: #3d664e;
 
-        --canvas-freeze-line-1px: #818183;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #888;
 
         --canvas-anim-pane-background: #404040;
@@ -259,5 +249,8 @@
         --rb-border-checked-hover: var(--border-regular-control);
         --rb-border-checked-focus: var(--border-control-focus);
         --rb-check-mark-background: var(--text-normal);
+
+        --highlight-comment-hover: #4B4B4B;
+        --highlight-comment-pressed: #656565;
     }
 }

apps/common/main/resources/less/colors-table-gray.less

@@ -36,8 +36,6 @@
         --highlight-button-pressed-hover: #bababa;
         --highlight-primary-dialog-button-hover: #1c1c1c;
         --highlight-primary-dialog-button-pressed: var(--highlight-primary-dialog-button-hover);
-        --highlight-accent-button-hover: #375478;
-        --highlight-accent-button-pressed: #293f59;
         --highlight-header-button-hover: #e0e0e0;
         --highlight-header-button-pressed: #cbcbcb;
         --highlight-text-select: #3494fb;
@@ -49,12 +47,10 @@
         --border-toolbar-active-tab: var(--background-toolbar-tab);
         --border-divider: #dfdfdf;
         --border-regular-control: #c0c0c0;
-        --border-toolbar-button-hover: #e0e0e0;
         --border-preview-hover: #bababa;
         --border-preview-select: #888;
         --border-control-focus: #848484;
         --border-color-shading: fade(#000, 15%);
-        --border-error: #f62211;
         --border-contrast-popover: #fff;
         --border-button-pressed-focus: #848484;
 
@@ -73,10 +69,7 @@
 
         --icon-normal: #444;
         --icon-normal-pressed: #444;
-        --icon-inverse: #444;
         --icon-toolbar-header: #444;
-        --icon-notification-badge: #000;
-        --icon-contrast-popover: #fff;
         --icon-success: #090;
 
         --highlight-header-tab-underline-document: var(--text-toolbar-header);
@@ -107,7 +100,6 @@
         --canvas-high-contrast: #000;
         --canvas-high-contrast-disabled: #666;
 
-        --canvas-cell-border: fade(#000, 10%);
         --canvas-cell-title-text: #444;
         --canvas-cell-title-background: #f7f7f7;
         --canvas-cell-title-background-hover: #dfdfdf;
@@ -142,8 +134,6 @@
         --canvas-sheet-view-cell-title-label: #121212;
         --canvas-sheet-view-select-all-icon: #3d664e;
 
-        --canvas-freeze-line-1px: #818182;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #999;
 
         // Others
@@ -214,6 +204,9 @@
         --toolbar-preferred-tab-style: fill;
         --border-editor-sdk: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
 
+        --highlight-comment-hover: #EBEAEB;
+        --highlight-comment-pressed: #DCDBDB;
+
         //--rb-background-normal: var(--background-normal);
         //--rb-background-normal-hover: var(--background-normal);
         //--rb-background-checked: var(--background-normal);

apps/common/main/resources/less/colors-table-ie-fix.less

@@ -48,20 +48,16 @@
 @highlight-header-button-hover-ie: fade(#000, 15%);
 @highlight-header-button-pressed-ie: fade(#000, 25%);
 @highlight-text-select-ie: #3494fb;
-@highlight-accent-button-hover-ie: #375478;
-@highlight-accent-button-pressed-ie: #293F59;
 @highlight-fill-button-hover-ie: #ffe165;
 @highlight-fill-button-pressed-ie: #dfb500;
 
 @border-toolbar-ie: #cbcbcb;
 @border-divider-ie: #cbcbcb;
 @border-regular-control-ie: #cfcfcf;
-@border-toolbar-button-hover-ie: #d8dadc;
 @border-preview-hover-ie: #cfcfcf;
 @border-preview-select-ie: #848484;
 @border-control-focus-ie: #848484;
 @border-color-shading-ie: fade(#000, 20%);
-@border-error-ie: #d9534f;
 @border-contrast-popover-ie: #fff;
 @border-button-pressed-focus-ie: #666d73;
 
@@ -77,10 +73,7 @@
 
 @icon-normal-ie: #444;
 @icon-normal-pressed-ie: #fff;
-@icon-inverse-ie: #444;
 @icon-toolbar-header-ie: #fff;
-@icon-notification-badge-ie: #000;
-@icon-contrast-popover-ie: #fff;
 @icon-success-ie: #5b9f27;
 
 @canvas-scroll-thumb-hover-ie: #c0c0c0;
@@ -244,6 +237,9 @@
 @toolbar-simple-shadow-ie: 0 none;
 @border-editor-sdk-ie: 1px solid @border-toolbar-ie;
 
+@highlight-comment-hover-ie: #EBEAEB;
+@highlight-comment-pressed-ie: #DCDBDB;
+
 @button-small-active-icon-offset-x-ie: -20px;
 
 .ie {

apps/common/main/resources/less/colors-table-night.less

@@ -18,8 +18,8 @@
         --background-toolbar: #404040;
         --background-toolbar-tab: #404040;
         --background-toolbar-additional: #404040;
-        --background-primary-dialog-button: #6e9fec;
-        --background-accent-button: #6e9fec;
+        --background-primary-dialog-button: #4A7BE0;
+        --background-accent-button: #4A7BE0;
         --background-notification-popover: #1F2C5C;
         --background-notification-badge: #ffd112;
         --background-scrim: fade(#000, 20%);
@@ -34,10 +34,8 @@
         --highlight-button-hover: #585858;
         --highlight-button-pressed: #686868;
         --highlight-button-pressed-hover: #7f7f7f;
-        --highlight-primary-dialog-button-hover: #4a87e7;
-        --highlight-primary-dialog-button-pressed: #446eca;
-        --highlight-accent-button-hover: #375478;
-        --highlight-accent-button-pressed: #293f59;
+        --highlight-primary-dialog-button-hover: #366CDA;
+        --highlight-primary-dialog-button-pressed: #2A5BB9;
         --highlight-header-button-hover: #585858;
         --highlight-header-button-pressed: #686868;
         --highlight-text-select: #3494fb;
@@ -49,14 +47,12 @@
         --border-toolbar-active-tab: var(--background-toolbar-tab);
         --border-divider: #585858;
         --border-regular-control: #686868;
-        --border-toolbar-button-hover: #eaeaea;
         --border-preview-hover: #92B7F0;
-        --border-preview-select: #4A87E7;
-        --border-control-focus: #4A87E7;
+        --border-preview-select: #4A7BE0;
+        --border-control-focus: #4A7BE0;
         --border-color-shading: #686868;
-        --border-error: #f62211;
         --border-contrast-popover: #686868;
-        --border-button-pressed-focus: #4A87E7;
+        --border-button-pressed-focus: #4A7BE0;
 
         --text-normal: #f3f3f3;
         --text-normal-pressed: #f9f9f9;
@@ -73,10 +69,7 @@
 
         --icon-normal: #eaeaea;
         --icon-normal-pressed: #eaeaea;
-        --icon-inverse: #171717;
         --icon-toolbar-header: #eaeaea;
-        --icon-notification-badge: #eaeaea;
-        --icon-contrast-popover: #fff;
         --icon-success: #78b588;
 
         --highlight-header-tab-underline-document: #4a87e7;
@@ -107,7 +100,6 @@
         --canvas-high-contrast: #eaeaea;
         --canvas-high-contrast-disabled: #666;
 
-        --canvas-cell-border: #686868;
         --canvas-cell-title-text: #b2b2b2;
         --canvas-cell-title-background: #222;
         --canvas-cell-title-background-hover: #404040;
@@ -142,8 +134,6 @@
         --canvas-sheet-view-cell-title-label: #fff;
         --canvas-sheet-view-select-all-icon: #f3f3f3;
 
-        --canvas-freeze-line-1px: #818182;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #999;
 
         // Others
@@ -248,7 +238,7 @@
 
         --border-fill-input: var(--border-regular-control);
         //--border-fill-input-focused: var(--border-control-focus);
-        --border-fill-input-focused: #4A87E7;
+        --border-fill-input-focused: #4A7BE0;
         --border-fill-input-disabled: var(--border-regular-control);
         --border-fill-input-readonly: var(--border-regular-control);
 
@@ -272,14 +262,14 @@
         --chb-check-mark-background: #fff;
         --chb-background-normal: var(--background-normal);
         --chb-background-normal-hover: #585858;
-        --chb-background-checked-hover: #4A87E7;
-        --chb-background-checked: #4A87E7;
         --chb-border-normal: #969696;
-        --chb-border-normal-hover: #969696;
-        --chb-border-normal-focus: #969696;
-        --chb-border-checked: #4A87E7;
-        --chb-border-checked-hover: #4A87E7;
-        --chb-border-checked-focus: #4A87E7;
+        --chb-border-normal-hover: #B2B2B2;
+        --chb-border-normal-focus: #B2B2B2;
+        --chb-background-checked: #4A7BE0;
+        --chb-background-checked-hover: #366CDA;
+        --chb-border-checked: #4A7BE0;
+        --chb-border-checked-hover: #366CDA;
+        --chb-border-checked-focus: #4A7BE0;
 
         // radio
         --rb-size: 14px;
@@ -287,27 +277,27 @@
         --rb-check-mark-background: #fff;
         --rb-background-normal: var(--background-normal);
         --rb-background-normal-hover: #585858;
-        --rb-background-checked-hover: #4A87E7;
-        --rb-background-checked: #4A87E7;
         --rb-border-normal: #969696;
-        --rb-border-normal-hover: #969696;
-        --rb-border-normal-focus: #969696;
-        --rb-border-checked: #4A87E7;
-        --rb-border-checked-hover: #4A87E7;
-        --rb-border-checked-focus: #4A87E7;
+        --rb-border-normal-hover: #B2B2B2;
+        --rb-border-normal-focus: #B2B2B2;
+        --rb-background-checked: #4A7BE0;
+        --rb-background-checked-hover: #366CDA;
+        --rb-border-checked: #4A7BE0;
+        --rb-border-checked-hover: #366CDA;
+        --rb-border-checked-focus: #4A7BE0;
 
         // slider
         --slider-track-height: 4px;
         --slider-border-radius: 2px;
         --slider-track-background-normal: #686868;
-        --slider-track-background-filled: #6e9fec;
+        --slider-track-background-filled: #4A7BE0;
         --slider-thumb-size: 18px;
         --slider-thumb-border-size: 3px;
         --slider-thumb-border-radius: 50%;
-        --slider-thumb-background-normal: #6e9fec;
+        --slider-thumb-background-normal: #4A7BE0;
         --slider-thumb-border-normal: #fff;
-        --slider-thumb-background-hover: #4a87e7;
-        --slider-thumb-background-active: #446eca;
+        --slider-thumb-background-hover: #366CDA;
+        --slider-thumb-background-active: #4A7BE0;
         --slider-thumb-shadow: 0 1px 2px 0 #0000000F, 0 1px 3px 0 #0000001A;
 
         --sprite-button-small-width: 48px;
@@ -344,5 +334,8 @@
         --icon-blue-secondary: #b7cff5;
         --icon-red: #fca5a5;
         --icon-success: #78b588;
+
+        --highlight-comment-hover: #383838;
+        --highlight-comment-pressed: #585858;
     }
 }

apps/common/main/resources/less/colors-table-white.less

@@ -18,8 +18,8 @@
         --background-toolbar: #FFFFFF;
         --background-toolbar-tab: #fff;
         --background-toolbar-additional: #efefef;
-        --background-primary-dialog-button: #4A87E7;
-        --background-accent-button: #4A87E7;
+        --background-primary-dialog-button: #4473ca;
+        --background-accent-button: #4473ca;
         --background-notification-popover: #fcfed7;
         --background-notification-badge: #ffd112;
         --background-scrim: fade(#000, 20%);
@@ -34,10 +34,8 @@
         --highlight-button-hover: #EAEAEA;
         --highlight-button-pressed: #E1E1E1;
         --highlight-button-pressed-hover: #bababa;
-        --highlight-primary-dialog-button-hover: #2566D5;
-        --highlight-primary-dialog-button-pressed: #1E53AE;
-        --highlight-accent-button-hover: #375478;
-        --highlight-accent-button-pressed: #293f59;
+        --highlight-primary-dialog-button-hover: #2A5BB9;
+        --highlight-primary-dialog-button-pressed: #1D4FAF;
         --highlight-header-button-hover: #eaeaea;
         --highlight-header-button-pressed: #e1e1e1;
         --highlight-text-select: #3494fb;
@@ -49,14 +47,12 @@
         --border-toolbar-active-tab: var(--background-toolbar-tab);
         --border-divider: #EAEAEA;
         --border-regular-control: #E1E1E1;
-        --border-toolbar-button-hover: #eaeaea;
         --border-preview-hover: #92B7F0;
-        --border-preview-select: #4A87E7;
-        --border-control-focus: #4A87E7;
+        --border-preview-select: #4473CA;
+        --border-control-focus: #4473CA;
         --border-color-shading: fade(#000, 15%);
-        --border-error: #f62211;
         --border-contrast-popover: #fff;
-        --border-button-pressed-focus: #4A87E7;
+        --border-button-pressed-focus: #4473CA;
 
         --text-normal: fade(#000, 80%);
         --text-normal-pressed: fade(#000, 80%);
@@ -73,10 +69,7 @@
 
         --icon-normal: #444;
         --icon-normal-pressed: #444;
-        --icon-inverse: #444;
         --icon-toolbar-header: #444;
-        --icon-notification-badge: #000;
-        --icon-contrast-popover: #fff;
         --icon-success: #090;
 
         --highlight-header-tab-underline-document: #446995;
@@ -107,7 +100,6 @@
         --canvas-high-contrast: #000;
         --canvas-high-contrast-disabled: #666;
 
-        --canvas-cell-border: fade(#000, 10%);
         --canvas-cell-title-text: #444;
         --canvas-cell-title-background: #f7f7f7;
         --canvas-cell-title-background-hover: #dfdfdf;
@@ -142,8 +134,6 @@
         --canvas-sheet-view-cell-title-label: #121212;
         --canvas-sheet-view-select-all-icon: #3d664e;
 
-        --canvas-freeze-line-1px: #818182;
-        --canvas-freeze-line-2px: #aaaaaa;
         --canvas-select-all-icon: #999;
 
         // Others
@@ -250,7 +240,7 @@
 
         --border-fill-input: var(--border-regular-control);
         //--border-fill-input-focused: var(--border-control-focus);
-        --border-fill-input-focused: #4A87E7;
+        --border-fill-input-focused: #4473CA;
         --border-fill-input-disabled: var(--border-regular-control);
         --border-fill-input-readonly: var(--border-regular-control);
 
@@ -273,43 +263,43 @@
         --chb-border-radius: 4px;
         --chb-check-mark-background: var(--background-normal);
         --chb-background-normal: var(--background-normal);
-        --chb-background-normal-hover: #F9F9F9;
-        --chb-background-checked-hover: #4A87E7;
-        --chb-background-checked: #4A87E7;
-        --chb-border-normal: #969696;
-        --chb-border-normal-hover: #969696;
-        --chb-border-normal-focus: #969696;
-        --chb-border-checked: #4A87E7;
-        --chb-border-checked-hover: #4A87E7;
-        --chb-border-checked-focus: #4A87E7;
+        --chb-background-normal-hover: #f3f3f3;
+        --chb-border-normal: #7f7f7f;
+        --chb-border-normal-hover: #686868;
+        --chb-border-normal-focus: #686868;
+        --chb-background-checked-hover: #4473CA;
+        --chb-background-checked: #4473CA;
+        --chb-border-checked: #4473CA;
+        --chb-border-checked-hover: #2A5BB9;
+        --chb-border-checked-focus: #4473CA;
 
         // radio
         --rb-size: 14px;
         --rb-check-mark-size: 3px;
         --rb-check-mark-background: var(--background-normal);
         --rb-background-normal: var(--background-normal);
-        --rb-background-normal-hover: #F9F9F9;
-        --rb-background-checked-hover: #4A87E7;
-        --rb-background-checked: #4A87E7;
-        --rb-border-normal: #969696;
-        --rb-border-normal-hover: #969696;
-        --rb-border-normal-focus: #969696;
-        --rb-border-checked: #4A87E7;
-        --rb-border-checked-hover: #4A87E7;
-        --rb-border-checked-focus: #4A87E7;
+        --rb-background-normal-hover: #f3f3f3;
+        --rb-border-normal: #7f7f7f;
+        --rb-border-normal-hover: #686868;
+        --rb-border-normal-focus: #686868;
+        --rb-background-checked: #4473CA;
+        --rb-background-checked-hover: #2A5BB9;
+        --rb-border-checked: #4473CA;
+        --rb-border-checked-hover: #2A5BB9;
+        --rb-border-checked-focus: #4473CA;
 
         // slider
         --slider-track-height: 4px;
         --slider-border-radius: 2px;
         --slider-track-background-normal: #EAEAEA;
-        --slider-track-background-filled: #446ECA;
+        --slider-track-background-filled: #4473CA;
         --slider-thumb-size: 18px;
         --slider-thumb-border-size: 3px;
         --slider-thumb-border-radius: 50%;
-        --slider-thumb-background-normal: #4A87E7;
+        --slider-thumb-background-normal: #4473CA;
         --slider-thumb-border-normal: #fff;
-        --slider-thumb-background-hover: #446ECA;
-        --slider-thumb-background-active: #3D59AF;
+        --slider-thumb-background-hover: #2A5BB9;
+        --slider-thumb-background-active: #1D4FAF;
         --slider-thumb-shadow: 0 1px 2px 0 #0000000F, 0 1px 3px 0 #0000001A;
 
         --sprite-button-small-width: 48px;
@@ -346,5 +336,8 @@
         --icon-blue-secondary: #dce7fa;
         --icon-red: #ef4444;
         --icon-success: #2e8b57;
+
+        --highlight-comment-hover: #F3F3F3;
+        --highlight-comment-pressed: #F0F4FC;
     }
 }

apps/common/main/resources/less/colors-table.less

@@ -45,8 +45,6 @@
     --highlight-button-pressed-hover: #bababa;
     --highlight-primary-dialog-button-hover: #1c1c1c;
     --highlight-primary-dialog-button-pressed: var(--highlight-primary-dialog-button-hover);
-    --highlight-accent-button-hover: #375478;
-    --highlight-accent-button-pressed: #293f59;
     --highlight-header-button-hover: fade(#000, 15%);
     --highlight-header-button-pressed: fade(#000, 25%);
     --highlight-text-select: #3494fb;
@@ -58,12 +56,10 @@
     --border-toolbar-active-tab: var(--background-toolbar);
     --border-divider: #dfdfdf;
     --border-regular-control: #c0c0c0;
-    --border-toolbar-button-hover: #e0e0e0;
     --border-preview-hover: #bababa;
     --border-preview-select: #888;
     --border-control-focus: #848484;
     --border-color-shading: fade(#000, 15%);
-    --border-error: #f62211;
     --border-contrast-popover: #fff;
     --border-button-pressed-focus: #848484;
 
@@ -82,10 +78,7 @@
 
     --icon-normal: #444;
     --icon-normal-pressed: #444;
-    --icon-inverse: #fff;
     --icon-toolbar-header: #fff;
-    --icon-notification-badge: #000;
-    --icon-contrast-popover: #fff;
     --icon-success: #090;
 
     --highlight-header-tab-underline-document: var(--text-toolbar-header);
@@ -116,7 +109,6 @@
     --canvas-high-contrast: #000;
     --canvas-high-contrast-disabled: #666;
 
-    --canvas-cell-border: fade(#000, 10%);
     --canvas-cell-title-text: #444;
     --canvas-cell-title-background: #f7f7f7;
     --canvas-cell-title-background-hover: #dfdfdf;
@@ -131,8 +123,6 @@
     --canvas-dark-cell-title-border: #3d3d3d;
     --canvas-dark-cell-title-border-hover: #5c5c5c;
     --canvas-dark-cell-title-border-selected: #0f0f0f;
-    --canvas-dark-content-background: #3a3a3a;
-    --canvas-dark-page-border: #2a2a2a;
 
     --canvas-scroll-thumb: #f7f7f7;
     --canvas-scroll-thumb-hover: #c0c0c0;
@@ -153,8 +143,6 @@
     --canvas-sheet-view-cell-title-label: #121212;
     --canvas-sheet-view-select-all-icon: #3d664e;
 
-    --canvas-freeze-line-1px: #818182;
-    --canvas-freeze-line-2px: #aaaaaa;
     --canvas-select-all-icon: #999;
 
     --canvas-anim-pane-background: #f7f7f7;
@@ -391,6 +379,9 @@
     --simple-editor-layout-collapse-button-rigth: 3px;
     --toolbar-preferred-tab-style: fill;
     --border-editor-sdk: var(--scaled-one-pixel, 1px) solid var(--border-toolbar);
+
+    --highlight-comment-hover: #EBEAEB;
+    --highlight-comment-pressed: #DCDBDB;
 }
 
 // Background
@@ -422,8 +413,6 @@
 @highlight-header-button-hover: var(--highlight-header-button-hover);
 @highlight-header-button-pressed: var(--highlight-header-button-pressed);
 @highlight-text-select: var(--highlight-text-select);
-@highlight-accent-button-hover: var(--highlight-accent-button-hover);
-@highlight-accent-button-pressed: var(--highlight-accent-button-pressed);
 @highlight-fill-button-hover: var(--highlight-fill-button-hover);
 @highlight-fill-button-pressed: var(--highlight-fill-button-pressed);
 
@@ -434,12 +423,10 @@
 @border-regular-control: var(--border-regular-control);
 @border-toolbar-active-panel-top: var(--border-toolbar-active-panel-top);
 @border-toolbar-active-tab: var(--border-toolbar-active-tab);
-@border-toolbar-button-hover: var(--border-toolbar-button-hover);
 @border-preview-hover: var(--border-preview-hover);
 @border-preview-select: var(--border-preview-select);
 @border-control-focus: var(--border-control-focus);
 @border-color-shading: var(--border-color-shading);
-@border-error: var(--border-error);
 @border-contrast-popover: var(--border-contrast-popover);
 @border-button-pressed-focus: var(--border-button-pressed-focus);
 
@@ -462,10 +449,7 @@
 // -------------------------
 @icon-normal: var(--icon-normal);
 @icon-normal-pressed: var(--icon-normal-pressed);
-@icon-inverse: var(--icon-inverse);
 @icon-toolbar-header: var(--icon-toolbar-header);
-@icon-contrast-popover: var(--icon-contrast-popover);
-@icon-notification-badge: var(--icon-notification-badge);
 @icon-success: var(--icon-success);
 
 @button-small-normal-icon-offset-x: var(--button-small-normal-icon-offset-x,0);
@@ -647,6 +631,9 @@
 @simple-editor-layout-collapse-button-rigth: var(--simple-editor-layout-collapse-button-rigth);
 @border-editor-sdk: var(--border-editor-sdk);
 
+@highlight-comment-hover: var(--highlight-comment-hover);
+@highlight-comment-pressed: var(--highlight-comment-pressed);
+
 // Canvas
 // ---------------------------
 @canvas-background: var(--canvas-background);

apps/common/main/resources/less/comments.less

@@ -122,6 +122,38 @@
             .margin-left-7();
         }
     }
+
+    .item {
+        padding: 10px 10px 0 10px;
+
+        .user-comment-item {
+            border: 1px solid transparent;
+            border-radius: 4px;
+            .box-shadow(2px 3px 4px 0px transparent);
+            padding: 0 10px 10px 10px;
+
+            &.last-item {
+                margin-bottom: 10px;
+            }
+        }
+
+        &:hover {
+            .user-comment-item {
+                background-color: @highlight-comment-hover-ie;
+                background-color: @highlight-comment-hover;
+            }
+        }
+        &.active {
+            .user-comment-item {
+                background-color: @highlight-comment-pressed-ie;
+                background-color: @highlight-comment-pressed;
+                border-color: @highlight-comment-pressed-ie;
+                border-color: @highlight-comment-pressed;
+                -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+                box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+            }
+        }
+    }
 }
 
 .dataview-ct  {
@@ -162,11 +194,11 @@
         margin-top: -1px;
     }
 
-    .separator-cmt {
-        border-bottom: @scaled-one-px-value-ie solid @border-toolbar-ie;
-        border-bottom: @scaled-one-px-value solid @border-toolbar;
-        margin: 20px 0px 0px 0px;
-    }
+    //.separator-cmt {
+    //    border-bottom: @scaled-one-px-value-ie solid @border-toolbar-ie;
+    //    border-bottom: @scaled-one-px-value solid @border-toolbar;
+    //    margin: 20px 0px 0px 0px;
+    //}
 
     .user-comment-item {
         position: relative;
@@ -319,13 +351,13 @@
         position: absolute;
         right: 0;
         top: 0;
-        margin: 11px 21px 10px 10px;
+        margin: 11px 15px 10px 10px;
         height: 20px;
 
         .rtl & {
             right: unset;
             left: 0;
-            margin: 11px 10px 10px 21px;
+            margin: 11px 10px 10px 15px;
         }
     }
 

apps/common/main/resources/less/header.less

@@ -357,6 +357,11 @@
             margin-top: calc(-1 * @font-size-base-app + 1px);
             fill: @icon-toolbar-header-ie;
             fill: @icon-toolbar-header;
+
+            .safari & {
+                margin-top: 0;
+                transform: translateY(-50%);
+            }
         }
     }
 
@@ -370,6 +375,11 @@
         text-align: center;
         overflow: hidden;
         pointer-events: none;
+
+        .safari & {
+            margin-top: 0;
+            line-height: 1;
+        }
     }
 
     &:not(:disabled) {

apps/common/main/resources/less/opendialog.less

@@ -30,6 +30,14 @@
 
       }
 
+      .controll-panel.margin-top {
+        margin-top: 8px;
+        
+        #id-delimiters-advanced {
+          margin-top: -3px;
+        }
+      }
+
       #id-preview {
         width: 100%;
         height: 110px !important;
@@ -39,6 +47,33 @@
         border: @border-regular-control solid @scaled-one-px-value;
       }
 
+      #id-delimiters-table {
+        display: inline-block;
+
+        #id-delimiter-other-row {
+          display: flex;
+
+          #id-delimiter-other {
+            position: relative;
+            .margin-left(10px);
+
+            .input-field {
+              position: absolute;
+              top: -3px
+            }
+          }
+        }
+
+        td {
+          padding-bottom: 8px;
+          .padding-right(24px);
+        }
+
+        tr:last-child td{
+          padding-bottom: 0;
+        }
+      }
+
       #id-preview-data {
         width: 100%;
         height: 108px !important;
@@ -46,29 +81,29 @@
         overflow:hidden;
       }
 
-      table {
+      #id-preview-table {
         min-height: 108px;
-      }
 
-      td {
-        padding: 1px 8px 1px 0;
-        border-right: @border-regular-control-ie solid @scaled-one-px-value-ie;
-        border-right: @border-regular-control solid @scaled-one-px-value;
-        min-width: 30px;
-        height: 17px;
-        white-space: nowrap;
-        .rtl & {
-          padding: 1px 0 1px 8px;
-        }
-      }
-
-      td:last-child {
-        border-right: none;
-      }
-
-      tr:last-child {
         td {
-          padding-bottom: 8px;
+          padding: 1px 8px 1px 0;
+          border-right: @border-regular-control-ie solid @scaled-one-px-value-ie;
+          border-right: @border-regular-control solid @scaled-one-px-value;
+          min-width: 30px;
+          height: 17px;
+          white-space: nowrap;
+          .rtl & {
+            padding: 1px 0 1px 8px;
+          }
+        }
+
+        td:last-child {
+          border-right: none;
+        }
+
+        tr:last-child {
+          td {
+            padding-bottom: 8px;
+          }
         }
       }
 

apps/common/main/resources/less/searchdialog.less

@@ -119,7 +119,7 @@
         .tools {
             display: flex;
             align-items: center;
-            div {
+            > div {
                 .margin-left-5();
                 &:first-of-type {
                     .margin-left-7();

apps/common/main/resources/less/switcher.less

@@ -2,10 +2,13 @@
     position: relative;
     width: 30px;
     height: 16px;
-    background-color: @border-preview-hover-ie;
-    background-color: @border-preview-hover;
+    background-color: @background-normal-ie;
+    background-color: @background-normal;
     border-radius: 11px;
     cursor: pointer;
+    border: 1px solid @chb-border-normal-ie;
+    border: 1px solid @chb-border-normal;
+    box-sizing: initial;
 
     .thumb {
         position: absolute;
@@ -14,17 +17,21 @@
         top: 0;
         height: 12px;
         border-radius: 12px;
-        background-color: @background-normal-ie;
-        background-color: @background-normal;
+        background-color: @chb-border-normal-ie;
+        background-color: @chb-border-normal;
         margin: 2px;
     }
 
     &.on {
         background-color: @background-primary-dialog-button-ie;
         background-color: @background-primary-dialog-button;
+        border: 1px solid @background-primary-dialog-button-ie;
+        border: 1px solid @background-primary-dialog-button;
         .thumb {
             right: 0;
             left: auto;
+            background-color: @background-normal-ie;
+            background-color: @background-normal;
         }
     }
 

apps/common/main/resources/less/synchronize-tip.less

@@ -136,7 +136,7 @@
             }
         }
 
-        .show-link label {
+        .show-link label span{
             border-bottom: @scaled-one-px-value-ie dotted @text-normal-ie;
             border-bottom: @scaled-one-px-value dotted @text-normal;
             color: @text-normal-ie;
@@ -494,12 +494,14 @@
     margin-top: 6px;
 }
 
-.show-link label {
+.show-link label span{
     border-bottom: @scaled-one-px-value-ie dotted @text-link-ie;
     border-bottom: @scaled-one-px-value dotted @text-link;
     color: @text-link-ie;
     color: @text-link;
     cursor: pointer;
+    word-break: break-word;
+    word-wrap: break-word;
 
     &:hover:not(:disabled) {
         color: @text-link-hover;

apps/common/main/resources/less/treeview.less

@@ -20,7 +20,7 @@
     }
   }
 
-  &:focus {
+  &:focus:not(.disabled) {
     border-color: @border-preview-select-ie;
     border-color: @border-preview-select;
   }
@@ -31,12 +31,6 @@
     .box-shadow(none);
     margin: 0;
 
-    &:hover,
-    &.over {
-      background-color: @highlight-button-hover-ie;
-      background-color: @highlight-button-hover;
-    }
-
     &.selected {
       background-color: @highlight-button-pressed-ie;
       background-color: @highlight-button-pressed;
@@ -47,7 +41,14 @@
     &.selected .empty {
       visibility: hidden;
     }
+  }
 
+  &:not(.disabled) > .item {
+    &:hover,
+    &.over {
+      background-color: @highlight-button-hover-ie;
+      background-color: @highlight-button-hover;
+    }
   }
 
   .tree-item {
@@ -95,6 +96,18 @@
       }
     }
   }
+
+  &.disabled {
+    > .item {
+      cursor: default;
+      opacity: @component-disabled-opacity-ie;
+      opacity: @component-disabled-opacity;
+    }
+
+    .tree-caret {
+      cursor: default;
+    }
+  }
 }
 
 .safari {

apps/common/main/resources/themes/full-theme-dark.json.example

@@ -31,8 +31,6 @@
         "highlight-button-pressed": "#49617D",
         "highlight-button-pressed-hover": "#808080",
         "highlight-primary-dialog-button-hover": "#d39eff",
-        "highlight-accent-button-hover": "#75a2d6",
-        "highlight-accent-button-pressed": "#89afdc",
         "highlight-header-button-hover": "rgba(255, 255, 255, 0.05)",
         "highlight-header-button-pressed": "rgba(255, 255, 255, 0.15)",
         "highlight-text-select": "#96c8fd",
@@ -41,12 +39,10 @@
         "border-toolbar-active-panel-top": "#616161",
         "border-divider": "#505050",
         "border-regular-control": "#666",
-        "border-toolbar-button-hover": "#5a5a5a",
         "border-preview-hover": "#757575",
         "border-preview-select": "#bdbdbd",
         "border-control-focus": "#b948ff",
         "border-color-shading": "rgba(255, 255, 255, 0.1)",
-        "border-error": "#f62211",
         "border-contrast-popover": "#666",
 
         "text-normal": "rgba(255, 255, 255, 0.8)",
@@ -64,10 +60,7 @@
 
         "icon-normal": "rgba(255, 255, 255, 0.8)",
         "icon-normal-pressed": "rgba(255, 255, 255, 0.8)",
-        "icon-inverse": "#444",
         "icon-toolbar-header": "rgba(255, 255, 255, 0.8)",
-        "icon-notification-badge": "#000",
-        "icon-contrast-popover": "#fff",
         "icon-success": "#090",
 
         "canvas-background": "#555",
@@ -84,7 +77,6 @@
         "canvas-high-contrast": "#fff",,
         "canvas-high-contrast-disabled": "#ccc",
 
-        "canvas-cell-border": "rgba(0, 0, 0, 0.1)",
         "canvas-cell-title": "#d9d9d9",
         "canvas-cell-title-border": "#757575",
         "canvas-cell-title-border-hover": "#858585",
@@ -117,8 +109,6 @@
         "canvas-sheet-view-cell-background-pressed": "#aaffcc",
         "canvas-sheet-view-cell-title-label": "#121214",
 
-        "canvas-freeze-line-1px": "#818183",
-        "canvas-freeze-line-2px": "#aaaaaa",
         "canvas-select-all-icon": "#3d664e"
     }
 }

apps/common/main/resources/themes/full-theme-light.json.example

@@ -32,8 +32,6 @@
         "highlight-button-pressed": "#cbcbcb",
         "highlight-button-pressed-hover": "#bababa",
         "highlight-primary-dialog-button-hover": "#52a6ff",
-        "highlight-accent-button-hover": "#375478",
-        "highlight-accent-button-pressed": "#293f59",
         "highlight-header-button-hover": "rgba(255, 255, 255, 0.15)",
         "highlight-header-button-pressed": "rgba(255, 255, 255, 0.25)",
         "highlight-text-select": "#3494fb",
@@ -42,12 +40,10 @@
         "border-toolbar-active-panel-top": "var(--background-toolbar)",
         "border-divider": "#dfdfdf",
         "border-regular-control": "#c0c0c0",
-        "border-toolbar-button-hover": "#e0e0e0",
         "border-preview-hover": "#bababa",
         "border-preview-select": "#888",
         "border-control-focus": "#2e8df2",
         "border-color-shading": "rgba(0, 0, 0, 0.15)",
-        "border-error": "#f62211",
         "border-contrast-popover": "#fff",
 
         "text-normal": "rgba(0, 0, 0, 0.8)",
@@ -65,10 +61,7 @@
 
         "icon-normal": "#444",
         "icon-normal-pressed": "#444",
-        "icon-inverse": "#fff",
         "icon-toolbar-header": "#fff",
-        "icon-notification-badge": "#000",
-        "icon-contrast-popover": "#fff",
         "icon-success": "#090",
 
         "canvas-background": "#eee",
@@ -85,7 +78,6 @@
         "canvas-high-contrast": "#000",
         "canvas-high-contrast-disabled": "#666",
 
-        "canvas-cell-border": "rgba(0, 0, 0, 0.1)",
         "canvas-cell-title": "#444",
         "canvas-cell-title-hover": "#dfdfdf",
         "canvas-cell-title-selected": "#cfcfcf",
@@ -99,8 +91,6 @@
         "canvas-dark-cell-title-border": "#3d3d3d",
         "canvas-dark-cell-title-border-hover": "#5c5c5c",
         "canvas-dark-cell-title-border-selected": "#0f0f0f",
-        "canvas-dark-content-background": "#3a3a3a",
-        "canvas-dark-page-border": "#2a2a2a",
 
         "canvas-scroll-thumb": "#f7f7f7",
         "canvas-scroll-thumb-hover": "#c0c0c0",
@@ -120,8 +110,6 @@
         "canvas-sheet-view-cell-background-pressed": "#aaffcc",
         "canvas-sheet-view-cell-title-label": "#121213",
 
-        "canvas-freeze-line-1px": "#818182",
-        "canvas-freeze-line-2px": "#aaaaaa",
         "canvas-select-all-icon": "#3d664e"
     }
 }

apps/common/mobile/lib/component/WheelColorPicker.jsx

@@ -1,38 +1,67 @@
-import React, { useEffect, useState } from 'react'
-import { f7, Icon } from 'framework7-react';
+import React, { useEffect, useState, useImperativeHandle } from 'react'
+import { f7 } from 'framework7-react';
 import { Device } from '../../../../common/mobile/utils/device';
 import SvgIcon from '@common/lib/component/SvgIcon'
 import IconPlusIos from '@common-ios-icons/icon-plus.svg?ios';
 import IconPlusAndroid from '@common-android-icons/icon-plus.svg?android';
 
-export const WheelColorPicker = ({ initialColor = '#ffffff', onSelectColor }) => {
-  const [color, setColor] = useState(initialColor);
+export const WheelColorPicker = ({ initialColor = '#ffffff', onSelectColor, ref }) => {
+    const [color, setColor] = useState(initialColor);
+    const pickerInstance = React.useRef(null);
 
-  useEffect(() => {
-    if (!document.getElementsByClassName('color-picker-wheel').length) {
-      f7.colorPicker.create({
-        containerEl: document.getElementsByClassName('color-picker-container')[0],
-        value: { hex: initialColor },
-        on: { change: (value) => setColor(value.getValue().hex) }
-      });
-    }
-  });
+    useImperativeHandle(ref, () => ({
+        update: () => {
+            if (pickerInstance.current?.modules) {
+                pickerInstance.current.update();
+            }
+        },
+        setValue: (hex) => {
+            if (pickerInstance.current) {
+                pickerInstance.current.setValue({ hex });
+            }
+        }
+    }), []);
 
-  return (
-    <div id='color-picker'>
-      <div className='color-picker-container'/>
-      <div className='right-block'>
-        <div className='color-hsb-preview'>
-          <div className='new-color-hsb-preview' style={{ backgroundColor: color }}/>
-          <div className='current-color-hsb-preview' style={{ backgroundColor: initialColor }}/>
+    useEffect(() => {
+        const container = document.querySelector('.color-picker-container');
+        if (!container || pickerInstance.current) return;
+
+        pickerInstance.current = f7.colorPicker.create({
+            containerEl: container,
+            value: { hex: initialColor },
+            on: {
+                change: (value) => setColor(value.getValue().hex)
+            }
+        });
+
+        return () => {
+            pickerInstance.current?.destroy();
+            pickerInstance.current = null;
+        };
+    }, []);
+
+    useEffect(() => {
+        if (pickerInstance.current) {
+            pickerInstance.current.setValue({ hex: initialColor });
+            setColor(initialColor);
+        }
+    }, [initialColor]);
+
+    return (
+        <div id='color-picker'>
+            <div className='color-picker-container'/>
+            <div className='right-block'>
+                <div className='color-hsb-preview'>
+                    <div className='new-color-hsb-preview' style={{ backgroundColor: color }}/>
+                    <div className='current-color-hsb-preview' style={{ backgroundColor: initialColor }}/>
+                </div>
+                <a href='#' id='add-new-color' className='button button-round' onClick={() => onSelectColor(color)}>
+                    {Device.ios ?
+                        <SvgIcon slot="media" symbolId={IconPlusIos.id} className='icon icon-svg'/> :
+                        <SvgIcon slot="media" symbolId={IconPlusAndroid.id} className='icon icon-svg white'/>
+                    }
+                </a>
+            </div>
         </div>
-        <a href='#' id='add-new-color' className='button button-round' onClick={() => onSelectColor(color)}>
-        {Device.ios ? 
-          <SvgIcon slot="media" symbolId={IconPlusIos.id} className='icon icon-svg' /> :
-          <SvgIcon slot="media" symbolId={IconPlusAndroid.id} className='icon icon-svg white' />
-        } 
-        </a>
-      </div>
-    </div>
-  )
+    )
 }

apps/common/mobile/lib/controller/Draw.jsx

@@ -3,59 +3,16 @@ import { DrawView } from "../view/Draw";
 import { inject, observer } from "mobx-react";
 import { Device } from "../../utils/device";
 import { LocalStorage } from '../../utils/LocalStorage.mjs';
+import { f7 } from 'framework7-react';
 
 const DEFAULT_TOOL_SETTINGS = {
-  pen: { color: '#FF0000', opacity: 100, lineSize: 2 },
-  highlighter: { color: '#FFFC54', opacity: 50, lineSize: 5 },
+    pen: { color: '#FF0000', opacity: 100, lineSize: 2 },
+    highlighter: { color: '#FFFC54', opacity: 50, lineSize: 5 },
 }
 const DEFAULT_ANDROID_COLORS = ['#FF0000', '#FFC000', '#FFFF00', '#92D050', '#00B050', '#00B0F0', '#0070C0', '#002060', '#C00000']
 const DEFAULT_IOS_COLORS = ['#FFFC54', '#72F54A', '#74F9FD', '#EB51F7', '#A900F9', '#FF0303', '#EF8B3A', '#D3D3D4', '#000000']
 
-export const DrawController = inject('storeAppOptions')(observer(({ storeAppOptions }) => {
-  const [currentTool, setCurrentTool] = useState(null);
-  const [toolSettings, setToolSettings] = useState(() => {
-    const stored = LocalStorage.getJson('draw-settings');
-    return stored || DEFAULT_TOOL_SETTINGS;
-  });
-  const [colors, setColors] = useState(() => {
-    const storageColors = LocalStorage.getJson('draw-colors', []);
-    if (!storageColors.length) {
-      return Device.android ? DEFAULT_ANDROID_COLORS : DEFAULT_IOS_COLORS
-    }
-    return storageColors
-  })
-  const [enableErasing, setEnableErasing] = useState(true);
-
-  const onApiFocusObject = () => {
-    if (storeAppOptions.isDrawMode && currentTool !== 'scroll') {
-      const api = Common.EditorApi.get();
-      setEnableErasing(api.asc_HaveInks());
-    }
-  }
-
-  useEffect(() => {
-    Common.Notifications.on('draw:start', () => {
-      storeAppOptions.changeDrawMode(true);
-      setCurrentToolAndApply('pen');
-    })
-
-    Common.Notifications.on('draw:stop', () => {
-      storeAppOptions.changeDrawMode(false);
-      setCurrentToolAndApply('scroll');
-    })
-
-    Common.Notifications.on('engineCreated', api => {
-      api.asc_registerCallback(window.editorType === 'sse' ? 'asc_onSelectionChanged' : 'asc_onFocusObject', onApiFocusObject);
-    });
-
-    return () => {
-      Common.Notifications.off('draw:start');
-      Common.Notifications.off('draw:stop');
-      Common.Notifications.off('engineCreated');
-    }
-  }, []);
-
-  const createStroke = (color, lineSize, opacity) => {
+const createStroke = (color, lineSize, opacity) => {
     const stroke = new Asc.asc_CStroke();
     stroke.put_type(Asc.c_oAscStrokeType.STROKE_COLOR);
     stroke.put_color(Common.Utils.ThemeColor.getRgbColor(color));
@@ -63,52 +20,118 @@ export const DrawController = inject('storeAppOptions')(observer(({ storeAppOpti
     stroke.put_width(lineSize);
     stroke.put_transparent(opacity * 2.55);
     return stroke;
-  };
+};
 
-  const toolActions = {
-    pen: (api, settings) => api.asc_StartDrawInk(createStroke(settings.pen.color, settings.pen.lineSize, settings.pen.opacity)),
-    highlighter: (api, settings) => api.asc_StartDrawInk(createStroke(settings.highlighter.color, settings.highlighter.lineSize, settings.highlighter.opacity)),
-    eraser: (api) => api.asc_StartInkEraser(),
-    eraseEntireScreen: (api) => api.asc_RemoveAllInks(),
-    scroll: (api) => api.asc_StopInkDrawer(),
-  };
-
-  const setCurrentToolAndApply = (tool) => {
-    const api = Common.EditorApi.get();
-    if (tool === 'eraseEntireScreen') {
-      toolActions.eraseEntireScreen(api);
-      toolActions[currentTool]?.(api, toolSettings);
-      setEnableErasing(false);
-    } else {
-      setCurrentTool(tool);
-      toolActions[tool]?.(api, toolSettings);
-    }
-  };
-
-  const updateToolSettings = (newSettings) => {
-    setToolSettings(prev => {
-      const updatedSettings = { ...prev, [currentTool]: { ...prev[currentTool], ...newSettings } };
-      const api = Common.EditorApi.get();
-      toolActions[currentTool]?.(api, updatedSettings);
-      LocalStorage.setJson('draw-settings', updatedSettings)
-      return updatedSettings;
+export const DrawController = inject('storeAppOptions')(observer(({ storeAppOptions }) => {
+    const [currentTool, setCurrentTool] = useState(null);
+    const [toolSettings, setToolSettings] = useState(() => {
+        const stored = LocalStorage.getJson('draw-settings');
+        return stored || DEFAULT_TOOL_SETTINGS;
     });
-  };
+    const [colors, setColors] = useState(() => {
+        const storageColors = LocalStorage.getJson('draw-colors', []);
+        if (!storageColors.length) {
+            return Device.android ? DEFAULT_ANDROID_COLORS : DEFAULT_IOS_COLORS
+        }
+        return storageColors
+    })
+    const [enableErasing, setEnableErasing] = useState(true);
 
-  const addCustomColor = (color) => {
-    const updatedColors = [...colors, color]
-    setColors(updatedColors)
-    updateToolSettings({ color })
-    LocalStorage.setJson('draw-colors', updatedColors)
-  }
+    const onApiFocusObject = React.useCallback(() => {
+        if (storeAppOptions.isDrawMode && currentTool !== 'scroll') {
+            const api = Common.EditorApi.get();
+            setEnableErasing(api.asc_HaveInks());
+        }
+    }, [storeAppOptions.isDrawMode, currentTool]);
 
-  return storeAppOptions.isDrawMode ? <DrawView
-    currentTool={currentTool}
-    setTool={setCurrentToolAndApply}
-    settings={toolSettings}
-    setSettings={updateToolSettings}
-    colors={colors}
-    addCustomColor={addCustomColor}
-    enableErasing={enableErasing}
-  /> : null
+    const toolActions = React.useMemo(() => ({
+        pen: (api, settings) => api.asc_StartDrawInk(createStroke(settings.pen.color, settings.pen.lineSize, settings.pen.opacity)),
+        highlighter: (api, settings) => api.asc_StartDrawInk(createStroke(settings.highlighter.color, settings.highlighter.lineSize, settings.highlighter.opacity)),
+        eraser: (api) => api.asc_StartInkEraser(),
+        eraseEntireScreen: (api) => api.asc_RemoveAllInks(),
+        scroll: (api) => api.asc_StopInkDrawer(),
+    }), []);
+
+    useEffect(() => {
+        const handleDrawStart = () => {
+            storeAppOptions.changeDrawMode(true);
+            setCurrentToolAndApply('pen');
+        };
+
+        const handleDrawStop = () => {
+            storeAppOptions.changeDrawMode(false);
+            setCurrentToolAndApply('scroll');
+        };
+
+        const handleEngineCreated = (api) => {
+            api.asc_registerCallback(
+                window.editorType === 'sse' ? 'asc_onSelectionChanged' : 'asc_onFocusObject',
+                onApiFocusObject
+            );
+        };
+
+        Common.Notifications.on('draw:start', handleDrawStart);
+        Common.Notifications.on('draw:stop', handleDrawStop);
+        Common.Notifications.on('engineCreated', handleEngineCreated);
+
+        return () => {
+            Common.Notifications.off('draw:start', handleDrawStart);
+            Common.Notifications.off('draw:stop', handleDrawStop);
+            Common.Notifications.off('engineCreated', handleEngineCreated);
+        };
+    }, [storeAppOptions, toolActions, toolSettings, onApiFocusObject]);
+
+    const setCurrentToolAndApply = (tool) => {
+        const api = Common.EditorApi.get();
+        if (tool === 'eraseEntireScreen') {
+            toolActions.eraseEntireScreen(api);
+            toolActions[currentTool]?.(api, toolSettings);
+            setEnableErasing(false);
+        } else {
+            setCurrentTool(tool);
+            toolActions[tool]?.(api, toolSettings);
+        }
+    };
+
+    const updateToolSettings = (newSettings) => {
+        setToolSettings(prev => {
+            const updatedSettings = { ...prev, [currentTool]: { ...prev[currentTool], ...newSettings } };
+            const api = Common.EditorApi.get();
+            toolActions[currentTool]?.(api, updatedSettings);
+            LocalStorage.setJson('draw-settings', updatedSettings)
+            return updatedSettings;
+        });
+    };
+
+    const addCustomColor = (color) => {
+        const updatedColors = [...colors, color]
+        setColors(updatedColors)
+        updateToolSettings({ color })
+        LocalStorage.setJson('draw-colors', updatedColors)
+    }
+
+    const closeBackdropSheet = (e) => {
+        e.preventDefault();
+        f7.sheet.close();
+    }
+
+    const attachBackdropSwipeClose = () => {
+        document.querySelector('.sheet-backdrop')?.addEventListener('touchmove', closeBackdropSheet);
+    }
+
+    const removeBackdropSwipeClose = () => {
+        document.querySelector('.sheet-backdrop')?.removeEventListener('touchmove', closeBackdropSheet);
+    }
+
+    return storeAppOptions.isDrawMode ? <DrawView
+        currentTool={currentTool}
+        setTool={setCurrentToolAndApply}
+        settings={toolSettings}
+        setSettings={updateToolSettings}
+        colors={colors}
+        addCustomColor={addCustomColor}
+        enableErasing={enableErasing}
+        attachBackdropSwipeClose={attachBackdropSwipeClose}
+        removeBackdropSwipeClose={removeBackdropSwipeClose}
+    /> : null
 }));

apps/common/mobile/lib/pages/CollaborationPage.jsx

@@ -11,8 +11,7 @@ import IconReviewAndroid from '@common-android-icons/icon-review.svg';
 import IconSharingSettings from '@common-icons/icon-sharing-settings.svg';
 import IconInsertCommentIos from '@common-ios-icons/icon-insert-comment.svg?ios';
 import IconInsertCommentAndroid from '@common-android-icons/icon-insert-comment.svg';
-import IconUsersIos from '@common-ios-icons/icon-users.svg?ios';
-import IconUsersAndroid from '@common-android-icons/icon-users.svg';
+import IconUsers from '@common-icons/icon-users.svg';
 
 const CollaborationPage = props => {
     const { t } = useTranslation();
@@ -44,10 +43,7 @@ const CollaborationPage = props => {
                 }
                 {props.users.editUsers.length > 0 &&
                     <ListItem link={'/users/'} title={_t.textUsers}>
-                        {Device.ios ? 
-                            <SvgIcon slot="media" symbolId={IconUsersIos.id} className={'icon icon-svg'} /> :
-                            <SvgIcon slot="media" symbolId={IconUsersAndroid.id} className={'icon icon-svg'} />
-                        }
+                            <SvgIcon slot="media" symbolId={IconUsers.id} className={'icon icon-svg'} />
                     </ListItem>
                 }
                 {appOptions.canViewComments &&

apps/common/mobile/lib/store/themes.js

@@ -44,7 +44,6 @@ export class storeThemes {
 		"canvas-high-contrast",
 		"canvas-high-contrast-disabled",
 
-		"canvas-cell-border",
 		"canvas-cell-title-border",
 		"canvas-cell-title-border-hover",
 		"canvas-cell-title-border-selected",

apps/common/mobile/lib/view/Draw.jsx

@@ -7,114 +7,153 @@ import IconDrawHighlighter from '../../../../common/mobile/resources/icons/draw-
 import IconClearAll from '../../../../common/mobile/resources/icons/clear-all.svg'
 import IconClearObject from '../../../../common/mobile/resources/icons/clear-object.svg'
 import IconScroll from '../../../../common/mobile/resources/icons/scroll.svg'
+import IconPlusIos from '@common-ios-icons/icon-plus.svg?ios';
+import IconPlusAndroid from '@common-android-icons/icon-plus.svg?android';
 import { WheelColorPicker } from "../component/WheelColorPicker";
 import { Device } from "../../utils/device";
 
-export const DrawView = ({ currentTool, setTool, settings, setSettings, colors, addCustomColor, enableErasing }) => {
-  const { t } = useTranslation();
-  const _t = t('Draw', { returnObjects: true });
-  const isDrawingTool = currentTool === 'pen' || currentTool === 'highlighter';
+export const DrawView = ({
+                             currentTool,
+                             setTool,
+                             settings,
+                             setSettings,
+                             colors,
+                             addCustomColor,
+                             enableErasing,
+                             attachBackdropSwipeClose,
+                             removeBackdropSwipeClose
+                         }) => {
+    const { t } = useTranslation();
+    const _t = t('Draw', { returnObjects: true });
 
-  return (
-    <React.Fragment>
-      {isDrawingTool && (<>
-        <Sheet className='draw-sheet draw-sheet--color-picker' backdrop swipeToClose onSheetClosed={() => f7.sheet.open('.draw-sheet--settings')}>
-          <div className='draw-sheet-label'><span>{_t.textCustomColor}</span></div>
-          <WheelColorPicker
-            initialColor={settings[currentTool].color}
-            onSelectColor={(color) => {
-              f7.sheet.close('.draw-sheet--color-picker')
-              addCustomColor(color)
-            }}
-          />
-        </Sheet>
-        <Sheet className="draw-sheet draw-sheet--settings" backdrop swipeToClose style={{ height: 'auto' }}>
-          <div id='swipe-handler' className='swipe-container'>
-            <Icon icon='icon icon-swipe'/>
-          </div>
-          <div className='draw-sheet-label'><span>{_t.textColor}</span></div>
-          <div className='draw-sheet--settings-colors'>
-            <div className="draw-sheet--settings-colors-list">
-              {colors.map((color, index) => (
-                <div
-                  key={index}
-                  className="draw-sheet--settings-colors-list-item" style={{ backgroundColor: color }}
-                  onClick={() => setSettings({ color })}
-                  onTouchStart={() => setSettings({ color })}
-                />
-              ))}
-              <div
-                className="draw-sheet--settings-colors-list-add" style={{ backgroundColor: settings[currentTool].color }}
-                onClick={() => {
-                  f7.sheet.close('.draw-sheet--settings')
-                  f7.sheet.open('.draw-sheet--color-picker')
-                }}
-              >
-                <Icon icon="icon-plus"/>
-              </div>
+    const pickerRef = React.useRef(null);
+    const isDrawingTool = currentTool === 'pen' || currentTool === 'highlighter';
+    const currentSettings = settings[currentTool] || {};
+    const currentColor = currentSettings.color || '#000000';
+
+    return (
+        <React.Fragment>
+            {isDrawingTool && (<>
+                <Sheet className='draw-sheet draw-sheet--color-picker' backdrop swipeToClose onSheetOpened={() => {
+                    attachBackdropSwipeClose();
+                }} onSheetClosed={() => {
+                    f7.sheet.open('.draw-sheet--settings');
+                    removeBackdropSwipeClose();
+                }}>
+                    <div className='draw-sheet-label'><span>{_t.textCustomColor}</span></div>
+                    <WheelColorPicker
+                        ref={pickerRef}
+                        initialColor={settings[currentTool].color}
+                        onSelectColor={(color) => {
+                            f7.sheet.close('.draw-sheet--color-picker')
+                            addCustomColor(color)
+                        }}
+                    />
+                </Sheet>
+
+                <Sheet className="draw-sheet draw-sheet--settings" backdrop swipeToClose onSheetOpen={() => {
+                    document.activeElement?.blur()
+                }} onSheetOpened={attachBackdropSwipeClose} onSheetClosed={removeBackdropSwipeClose}
+                       style={{ height: 'auto' }}>
+                    <div id='swipe-handler' className='swipe-container'>
+                        <Icon icon='icon icon-swipe'/>
+                    </div>
+                    <div className='draw-sheet-label'><span>{_t.textColor}</span></div>
+                    <div className='draw-sheet--settings-colors'>
+                        <div className="draw-sheet--settings-colors-list">
+                            {colors.map((color, index) => {
+
+                                const isSelected = color.toLowerCase() === currentColor.toLowerCase();
+                                return (<div
+                                    key={index}
+                                    className="draw-sheet--settings-colors-list-item"
+                                    style={{ backgroundColor: color }}
+                                    data-selected={isSelected}
+                                    onClick={() => setSettings({ color })}
+                                    onTouchStart={() => setSettings({ color })}
+                                />)
+                            })}
+                            <div
+                                className="draw-sheet--settings-colors-list-add"
+                                style={{ backgroundColor: settings[currentTool].color }}
+                                onClick={() => {
+                                    f7.sheet.close('.draw-sheet--settings');
+                                    f7.sheet.open('.draw-sheet--color-picker');
+                                    pickerRef.current?.update();
+                                }}
+                            >
+                                {Device.ios
+                                    ? (<SvgIcon slot="media" symbolId={IconPlusIos.id} className='icon icon-svg'/>)
+                                    : (<SvgIcon slot="media" symbolId={IconPlusAndroid.id}
+                                                className='icon icon-svg white'/>)
+                                }
+                            </div>
+                        </div>
+                    </div>
+                    <div className='draw-sheet-label'><span>{_t.textLineSize}</span></div>
+                    <div className='draw-sheet-item'>
+                        {/*{Device.android ? (*/}
+                        <Range
+                            min={0.5} max={10} step={0.5} value={settings[currentTool].lineSize}
+                            onRangeChange={(value) => setSettings({ lineSize: value })}
+                        />
+                        {/*) : (*/}
+                        {/*   <input className='line-size-range--ios' type='range' min={0.5} max={10} step={0.5} value={settings[currentTool].lineSize} onChange={(e) => setSettings({ lineSize: parseInt(e.target.value) })} />*/}
+                        {/* )}*/}
+                    </div>
+                    <div className='draw-sheet-label'><span>{_t.textOpacity}</span></div>
+                    <div className='draw-sheet-item'>
+                        <input style={{ '--color': settings[currentTool].color }}
+                               className={Device.android ? 'opacity-range-input--android' : 'opacity-range-input--ios'}
+                               type='range' min={0} max={100} step={1}
+                               value={settings[currentTool].opacity}
+                               onChange={(e) => setSettings({ opacity: parseInt(e.target.value) })}/>
+                    </div>
+                </Sheet>
+            </>)}
+            <div className="draw-toolbar">
+                <div className="draw-toolbar-item">
+                    <Button type='button' fill={currentTool === 'pen'} onClick={() => setTool('pen')}>
+                        <SvgIcon symbolId={IconDrawPen.id} className='icon icon-svg'/>
+                    </Button>
+                </div>
+                <div className="draw-toolbar-item">
+                    <Button type='button' fill={currentTool === 'highlighter'} onClick={() => setTool('highlighter')}>
+                        <SvgIcon symbolId={IconDrawHighlighter.id} className='icon icon-svg'/>
+                    </Button>
+                </div>
+                <div className="draw-toolbar-item">
+                    <Button type='button' sheetOpen={isDrawingTool ? ".draw-sheet--settings" : undefined}
+                            disabled={!isDrawingTool}>
+                        <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                            <circle cx="50%" cy="50%" r="8" fill={settings[currentTool]?.color || '#808080'}/>
+                        </svg>
+                    </Button>
+                </div>
+                <div className="draw-toolbar-item">
+                    <div className='draw-toolbar-divider'/>
+                </div>
+                <div className="draw-toolbar-item">
+                    <Button type='button' disabled={!enableErasing} fill={currentTool === 'eraser'}
+                            onClick={() => setTool('eraser')}>
+                        <SvgIcon symbolId={IconClearObject.id} className='icon icon-svg'/>
+                    </Button>
+                </div>
+                <div className="draw-toolbar-item">
+                    <Button type='button' disabled={!enableErasing} onClick={() => setTool('eraseEntireScreen')}>
+                        <SvgIcon symbolId={IconClearAll.id} className='icon icon-svg'/>
+                    </Button>
+                </div>
+                <div className="draw-toolbar-item">
+                    <div className='draw-toolbar-divider'/>
+                </div>
+                <div className="draw-toolbar-item">
+                    <Button type='button' fill={currentTool === 'scroll'} onClick={() => setTool('scroll')}
+                            tabIndex='-1'>
+                        <SvgIcon symbolId={IconScroll.id} className='icon icon-svg'/>
+                    </Button>
+                </div>
             </div>
-          </div>
-          <div className='draw-sheet-label'><span>{_t.textLineSize}</span></div>
-          <div className='draw-sheet-item'>
-            {/*{Device.android ? (*/}
-            <Range
-              min={0.5} max={10} step={0.5} value={settings[currentTool].lineSize}
-              onRangeChange={(value) => setSettings({ lineSize: value })}
-            />
-            {/*) : (*/}
-            {/*   <input className='line-size-range--ios' type='range' min={0.5} max={10} step={0.5} value={settings[currentTool].lineSize} onChange={(e) => setSettings({ lineSize: parseInt(e.target.value) })} />*/}
-            {/* )}*/}
-          </div>
-          <div className='draw-sheet-label'><span>{_t.textOpacity}</span></div>
-          <div className='draw-sheet-item'>
-            <input style={{ '--color': settings[currentTool].color }}
-                   className={Device.android ? 'opacity-range-input--android' : 'opacity-range-input--ios'} type='range' min={0} max={100} step={1}
-                   value={settings[currentTool].opacity}
-                   onChange={(e) => setSettings({ opacity: parseInt(e.target.value) })}/>
-          </div>
-        </Sheet>
-      </>)}
-      <div className="draw-toolbar">
-        <div className="draw-toolbar-item">
-          <Button type='button' fill={currentTool === 'pen'} onClick={() => setTool('pen')}>
-            <SvgIcon symbolId={IconDrawPen.id} className='icon icon-svg'/>
-          </Button>
-        </div>
-        <div className="draw-toolbar-item">
-          <Button type='button' fill={currentTool === 'highlighter'} onClick={() => setTool('highlighter')}>
-            <SvgIcon symbolId={IconDrawHighlighter.id} className='icon icon-svg'/>
-          </Button>
-        </div>
-        <div className="draw-toolbar-item">
-          <Button type='button' sheetOpen={isDrawingTool ? ".draw-sheet--settings" : undefined} disabled={!isDrawingTool}>
-            <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
-              <circle cx="50%" cy="50%" r="8" fill={settings[currentTool]?.color || '#808080'}/>
-            </svg>
-          </Button>
-        </div>
-        <div className="draw-toolbar-item">
-          <div className='draw-toolbar-divider'/>
-        </div>
-        <div className="draw-toolbar-item">
-          <Button type='button' disabled={!enableErasing} fill={currentTool === 'eraser'} onClick={() => setTool('eraser')}>
-            <SvgIcon symbolId={IconClearObject.id} className='icon icon-svg'/>
-          </Button>
-        </div>
-        <div className="draw-toolbar-item">
-          <Button type='button' disabled={!enableErasing} onClick={() => setTool('eraseEntireScreen')}>
-            <SvgIcon symbolId={IconClearAll.id} className='icon icon-svg'/>
-          </Button>
-        </div>
-        <div className="draw-toolbar-item">
-          <div className='draw-toolbar-divider'/>
-        </div>
-        <div className="draw-toolbar-item">
-          <Button type='button' fill={currentTool === 'scroll'} onClick={() => setTool('scroll')} tabIndex='-1'>
-            <SvgIcon symbolId={IconScroll.id} className='icon icon-svg'/>
-          </Button>
-        </div>
-      </div>
-    </React.Fragment>
-  )
-}
-
+        </React.Fragment>
+    )
+}

apps/common/mobile/lib/view/Search.jsx

@@ -90,7 +90,7 @@ class SearchView extends Component {
 
     componentDidMount() {
         this.$replace = $$('#idx-replace-val');
-        const $editor = $$('#editor_sdk');
+        const $editor = $$('#id_viewer_overlay, #ws-canvas-graphic-overlay');
 
         this.onEditorTouchStart = this.onEditorTouchStart.bind(this);
         this.onEditorTouchEnd = this.onEditorTouchEnd.bind(this);
@@ -132,7 +132,7 @@ class SearchView extends Component {
     }
 
     componentWillUnmount() {
-        $$('#editor_sdk')
+        $$('#id_viewer_overlay, #ws-canvas-graphic-overlay')
             .off('pointerdown', this.onEditorTouchStart)
             .off('pointerup', this.onEditorTouchEnd);
         

apps/common/mobile/lib/view/collaboration/Collaboration.jsx

@@ -79,15 +79,17 @@ const CollaborationView = props => {
         }
     }, []);
 
+    const initUrl = props.showOptions ? `/${props.showOptions}/` : '/collaboration-page/';
+
     return (
         !Device.phone ?
             <Popover id="coauth-popover" className="popover__titled" onPopoverClosed={() => props.closeOptions('coauth')} closeByOutsideClick={false}>
-                <View style={{height: '430px'}} routes={routes} url='/collaboration-page/'>
+                <View style={{height: '430px'}} routes={routes} url={initUrl}>
                     <CollaborationPage />
                 </View>
             </Popover> :
             <Sheet className="coauth__sheet" onSheetClosed={() => props.closeOptions('coauth')}>
-                <View routes={routes} url='/collaboration-page/'>
+                <View routes={routes} url={initUrl}>
                     <CollaborationPage />
                 </View>
             </Sheet>

apps/common/mobile/resources/css/skeleton.css

@@ -149,6 +149,14 @@ body.theme-type-dark {
     height: 26px;
 }
 
+.ios .subnavbar .subnavbar-inner .right a + a {
+    margin-left: 0;
+}
+
+.ios .subnavbar .subnavbar-inner {
+    padding-right: 0;
+}
+
 :root .theme-type-dark {
     --f7-navbar-bg-color: #232323;
     --f7-bars-bg-color-rgb: 35,35,35;
@@ -156,26 +164,52 @@ body.theme-type-dark {
     --f7-bars-translucent-opacity: 1;
 }
 
+.word-editor {
+    --skl-toolbar-icons: var(--toolbar-icons, #446995);
+}
+
 .md .word-editor {
     --f7-navbar-bg-color: var(--background-navbar-word, #446995);
     --f7-subnavbar-bg-color: var(--background-navbar-word, #446995);
     --f7-subnavbar-height: 56px;
 }
 
+.cell-editor {
+    --skl-toolbar-icons: var(--toolbar-icons, #40865c);
+}
+
 .md .cell-editor {
     --f7-navbar-bg-color: var(--background-navbar-cell, #40865c);
     --f7-subnavbar-bg-color: var(--background-navbar-cell, #40865c);
     --f7-subnavbar-height: 56px;
 }
 
+.slide-editor {
+    --skl-toolbar-icons: var(--toolbar-icons, #BE664F);
+}
+
 .md .slide-editor {
     --f7-navbar-bg-color: var(--background-navbar-slide, #BE664F);
     --f7-subnavbar-bg-color: var(--background-navbar-slide, #BE664F);
     --f7-subnavbar-height: 56px;
 }
 
+.visio-editor {
+    --skl-toolbar-icons: var(--toolbar-icons, #444796);
+}
+
 .md .visio-editor {
     --f7-navbar-bg-color: var(--background-navbar-visio, #444796);
     --f7-subnavbar-bg-color: var(--background-navbar-visio, #444796);
     --f7-subnavbar-height: 56px;
 }
+
+.md .theme-type-light {
+    --skl-toolbar-icons: var(--toolbar-icons, #fff);
+}
+
+.icon-svg {
+    width: 24px;
+    height: 24px;
+    fill: var(--skl-toolbar-icons);
+}

apps/common/mobile/resources/icons/common/icon-text-bold.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.5436 18C15.3109 18 17 16.5946 17 14.3063C17 12.5856 15.7601 11.3153 13.9991 11.1441V11.0721C15.3288 10.8559 16.3621 9.63964 16.3621 8.24324C16.3621 6.27027 14.8437 5 12.4897 5H7V18H12.5436ZM9.31806 6.81081H11.9146C13.2893 6.81081 14.071 7.45045 14.071 8.58559C14.071 9.79279 13.1635 10.4775 11.5463 10.4775H9.31806V6.81081ZM9.31806 16.1892V12.1261H11.9236C13.6936 12.1261 14.628 12.8198 14.628 14.1441C14.628 15.4775 13.7206 16.1892 12.0135 16.1892H9.31806Z"/>
+</svg>

apps/common/mobile/resources/icons/common/icon-text-direction-context.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.9014 16.1201L21.8242 18.6211C21.9349 18.7159 21.9988 18.8552 21.999 19.001C21.999 19.1468 21.9348 19.2859 21.8242 19.3809L18.9014 21.8818L18.5215 22.207L17.8711 21.4473L18.251 21.1221L20.1455 19.501H3.85547L5.75 21.123L6.12988 21.4473L5.47949 22.207L5.09961 21.8828L2.17676 19.3809C2.06611 19.2859 2.00196 19.1468 2.00195 19.001C2.00214 18.8551 2.06596 18.716 2.17676 18.6211L5.09961 16.1201L5.47949 15.7949L6.12988 16.5547L5.75 16.8799L3.85547 18.501H20.1455L18.251 16.8799L17.8711 16.5547L18.5215 15.7949L18.9014 16.1201ZM18.9951 3H14.6328V15.9971H13.6328V3H10.2705V15.9971H9.27051V10.2207H6.11035C3.84032 10.2207 2.00013 8.38035 2 6.11035C2.00002 3.84026 3.84026 2 6.11035 2H18.9951V3ZM6.11035 3C4.39254 3 3.00002 4.39255 3 6.11035C3.00013 7.82806 4.39261 9.2207 6.11035 9.2207H9.27051V3H6.11035Z"/>
+</svg>

apps/common/mobile/resources/icons/common/icon-text-italic.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 18L13 5H15L12 18H10Z"/>
+</svg>

apps/common/mobile/resources/icons/common/icon-text-strikethrough.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.9767 19C9.13025 19 7.15814 17.4413 7 15.0469H8.68372C8.84186 16.5117 10.2186 17.4789 12.1349 17.4789C13.9489 17.4789 15.2698 16.5117 15.2698 15.1784C15.2698 14.1421 14.6226 13.4669 13.1631 13H4V12H9.70758C8.10681 11.333 7.38141 10.3271 7.38141 8.83099C7.38141 6.57745 9.3349 5 12.1256 5C14.7953 5 16.7302 6.59625 16.8046 8.86853H15.1302C14.9814 7.41315 13.8186 6.52112 12.0698 6.52112C10.3303 6.52112 9.12091 7.43192 9.12091 8.75586C9.12091 9.77936 9.86511 10.3897 11.6884 10.8685L13.093 11.2441C13.9345 11.4572 14.6245 11.7047 15.1776 12H20V13H16.4087C16.8147 13.5368 17 14.1832 17 14.9718C17 17.4507 15.0651 19 11.9767 19Z"/>
+</svg>

apps/common/mobile/resources/icons/common/icon-text-underline.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 5H9V12.4519C9 14.0634 10.1956 15.1595 12 15.1595C13.8044 15.1595 15 14.0634 15 12.4519V5H17V12.6401C17 15.2168 15.086 17 12 17C8.92242 17 7 15.2168 7 12.6401V5Z"/>
+<path d="M17 20V19H7V20H17Z"/>
+</svg>

apps/common/mobile/resources/icons/common/icon-users.svg

@@ -1,4 +1,4 @@
 <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M12.0138 14C9.18567 14 7.01647 15.4069 5.9043 17.2572C5.3423 18.1923 5.50366 18.562 5.60508 18.6903C5.75845 18.8844 6.11323 19 6.47655 19H12.0138V20H6.47655C6.00508 20 5.25793 19.8656 4.8186 19.3097C4.32732 18.688 4.4052 17.8077 5.0453 16.7428C6.33733 14.5931 8.83148 13 12.0138 13V14ZM12.0138 13C15.1962 13 17.6627 14.5931 18.9547 16.7428C19.5948 17.8077 19.6727 18.688 19.1814 19.3097C18.7421 19.8656 17.9949 20 17.5234 20H12.0138V19H17.5234C17.8868 19 18.2415 18.8844 18.3949 18.6903C18.4963 18.562 18.6577 18.1923 18.0957 17.2572C16.9835 15.4069 14.842 14 12.0138 14V13Z"/>
-<path d="M12.0137 4.5C13.614 4.5 15.0205 6.00307 15.0205 8C15.0205 9.99693 13.614 11.5 12.0137 11.5C10.4134 11.4998 9.00781 9.99682 9.00781 8C9.00781 6.00318 10.4134 4.50016 12.0137 4.5Z"/>
+<path d="M14.5204 8C14.5204 6.21528 13.278 5 12.0136 5C10.7493 5.00017 9.50773 6.2154 9.50773 8C9.50773 9.7846 10.7493 10.9998 12.0136 11V12C10.0773 11.9998 8.50773 10.209 8.50773 8C8.50773 5.79096 10.0773 4.00016 12.0136 4C13.95 4 15.5204 5.79086 15.5204 8L15.5155 8.20605C15.4215 10.3194 13.8894 12 12.0136 12V11C13.278 11 14.5204 9.78472 14.5204 8Z"/>
 </svg>

apps/common/mobile/resources/icons/ios/icon-users.svg

@@ -1,4 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0138 14C9.18567 14 7.01647 15.4069 5.9043 17.2572C5.3423 18.1923 5.50366 18.562 5.60508 18.6903C5.75845 18.8844 6.11323 19 6.47655 19H12.0138V20H6.47655C6.00508 20 5.25793 19.8656 4.8186 19.3097C4.32732 18.688 4.4052 17.8077 5.0453 16.7428C6.33733 14.5931 8.83148 13 12.0138 13V14ZM12.0138 13C15.1962 13 17.6627 14.5931 18.9547 16.7428C19.5948 17.8077 19.6727 18.688 19.1814 19.3097C18.7421 19.8656 17.9949 20 17.5234 20H12.0138V19H17.5234C17.8868 19 18.2415 18.8844 18.3949 18.6903C18.4963 18.562 18.6577 18.1923 18.0957 17.2572C16.9835 15.4069 14.842 14 12.0138 14V13Z"/>
-<path d="M12.0137 4.5C13.614 4.5 15.0205 6.00307 15.0205 8C15.0205 9.99693 13.614 11.5 12.0137 11.5C10.4134 11.4998 9.00781 9.99682 9.00781 8C9.00781 6.00318 10.4134 4.50016 12.0137 4.5Z"/>
-</svg>

apps/common/mobile/resources/less/colors-table-dark.less

@@ -59,7 +59,6 @@
         --canvas-high-contrast: #000;
         //--canvas-high-contrast-disabled: #000;
 
-        --canvas-cell-border: fade(#000, 10%);
         --canvas-cell-title-border: #757575;
         --canvas-cell-title-border-hover: #858585;
         --canvas-cell-title-border-selected: #999;

apps/common/mobile/resources/less/colors-table.less

@@ -56,7 +56,6 @@
     --canvas-high-contrast: #000;
     //--canvas-high-contrast-disabled: #666;
 
-    --canvas-cell-border: #999;
     --canvas-cell-title-text: fade(#000, 80%);
     --canvas-cell-title-background: #f7f7f7;
     --canvas-cell-title-background-selected: #cfcfcf;

apps/common/mobile/resources/less/common-ios.less

@@ -685,6 +685,16 @@
         background-color: @background-warning;
         margin-left: 10px;
     }
+
+    .popover {
+        box-shadow: 0 10px 100px 0 rgba(0, 0, 0, 0.3);
+    }
+
+    .sheet-modal, .dropdown-list-popup {
+        box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.16);
+    }
+    
+
 }
 
 

apps/common/mobile/resources/less/common-material.less

@@ -629,6 +629,9 @@
         }
         .title, a {
             color: @text-normal;
+            .icon-svg.done {
+              fill: @brand-word;
+            }
         }
     }
 
@@ -765,4 +768,9 @@
             display: inline-block;
         }
     }
+
+    .sheet-modal.calendar, .dropdown-list-popup {
+        box-shadow:0 3.75px 11px 0 rgba(0, 0, 0, 0.19),
+                0 0.5px  5px  0 rgba(0, 0, 0, 0.039);
+    }
 }

apps/common/mobile/resources/less/common.less

@@ -122,6 +122,10 @@
     transition: all .3s;
 }
 
+.popover-backdrop, .sheet-backdrop, .popup-backdrop {
+    background-color: transparent;
+}
+
 .disabled, [disabled] {
     opacity: .55;
     pointer-events: none;

apps/common/mobile/resources/less/draw.less

@@ -56,10 +56,28 @@
             grid-template-columns: repeat(10, 1fr);
             gap: 2px;
 
+            @media (min-width: 550px) {
+                gap: 4px;
+            }
+
             &-item {
                 border: 1px solid;
                 aspect-ratio: 1;
                 border-color: @background-menu-divider;
+
+                &[data-selected="true"] {
+                    position: relative;
+                    border: 2px solid @background-primary;
+
+                    &:after {
+                        content: '';
+                        position: absolute;
+                        inset: -5px;
+                        background-color: @brandColor;
+                        z-index: -1;
+                        border-radius: 4px;
+                    }
+                }
             }
 
             &-add {
@@ -70,8 +88,9 @@
                 aspect-ratio: 1;
                 border: 2px solid @background-primary;
 
-                i {
-                    background-color: @brandColor;
+                svg {
+                    width: 24px;
+                    height: 24px;
                 }
 
                 &:after {
@@ -110,7 +129,6 @@
         display: flex;
         justify-content: space-between;
         align-items: center;
-        padding-inline: 10px;
         width: 100%;
 
         @media (min-width: 550px) {
@@ -125,6 +143,14 @@
                 justify-content: center;
             }
 
+            &:first-child {
+                margin-left: 10px;
+            }
+
+            &:last-child {
+               margin-right: 10px;
+            }
+
             button {
                 display: flex;
                 padding: 0;
@@ -138,6 +164,13 @@
                     color: @brandColor;
                     background-color: @button-active-opacity;
                 }
+
+                &:after {
+                    content: '';
+                    position: absolute;
+                    inset: -4px;
+                    z-index: -1;
+                }
             }
         }
 

apps/common/mobile/resources/less/icons-preload.less

@@ -0,0 +1,4 @@
+.icon-svg {
+  width: 24px;
+  height: 24px;
+}

apps/common/mobile/resources/less/icons.less

@@ -2,7 +2,5 @@
 @import "./material/icons";
 
 .icon-svg {
-    width: 24px;
-    height: 24px;
     fill: @brandColor;
 }

apps/documenteditor/embed/js/ApplicationController.js

@@ -912,6 +912,10 @@ DE.ApplicationController = new(function(){
             case Asc.c_oAscError.ID.SessionToken: // don't show error message
                 return;
 
+            case Asc.c_oAscError.ID.CopyDisabled:
+                message= me.errorCopyDisabled;
+                break;
+
             default:
                 // message = me.errorDefaultMessage.replace('%1', id);
                 // break;
@@ -1201,6 +1205,7 @@ DE.ApplicationController = new(function(){
         textCancel: 'Cancel',
         txtSecurityWarningLink: 'This document is trying to connect to %1.<br>If you trust this site, press \"OK\" while holding down the ctrl key.',
         txtSecurityWarningOpenFile: 'This document is trying to open file dialog, press \"OK\" to open.',
-        txtSecurityWarningLinkOk: 'This document is trying to connect to %1.<br>If you trust this site, press \"OK\".'
+        txtSecurityWarningLinkOk: 'This document is trying to connect to %1.<br>If you trust this site, press \"OK\".',
+        errorCopyDisabled: 'For security reasons, the contents of this document cannot be copied to the clipboard.'
     }
 })();

apps/documenteditor/embed/locale/de.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Herunterladen ist fehlgeschlagen.",
   "DE.ApplicationController.downloadTextText": "Dokument wird heruntergeladen...",
   "DE.ApplicationController.errorAccessDeny": "Sie versuchen, eine Aktion durchzuführen, für die Sie keine Rechte haben.<br>Bitte wenden Sie sich an Ihren Document Serveradministrator.",
+  "DE.ApplicationController.errorCopyDisabled": "Aus Sicherheitsgründen darf der Inhalt dieses Dokuments nicht kopiert werden.",
   "DE.ApplicationController.errorDefaultMessage": "Fehlercode: %1",
   "DE.ApplicationController.errorEditingDownloadas": "Fehler bei der Bearbeitung.<br>Speichern Sie eine Kopie dieser Datei auf Ihrem Computer, indem Sie auf \"Herunterladen als...\" klicken.",
   "DE.ApplicationController.errorFilePassProtect": "Das Dokument ist kennwortgeschützt und kann nicht geöffnet werden.",
@@ -53,8 +54,9 @@
   "DE.ApplicationController.txtClose": "Schließen",
   "DE.ApplicationController.txtEmpty": "(Leer)",
   "DE.ApplicationController.txtNo": "Nein",
-  "DE.ApplicationController.txtOpenWarning": "Das Klicken auf diesen Link kann Ihr Gerät und Ihre Daten schädigen. Um Ihren Computer zu schützen, klicken Sie nur auf Hyperlinks aus vertrauenswürdigen Quellen. Dieser Ort ist möglicherweise unsicher:<br>%1<br>Möchten Sie wirklich fortfahren?",
+  "DE.ApplicationController.txtOpenWarning": "Das Klicken auf diesen Link kann Ihrem Gerät und Ihren Daten schaden. Um Ihren Computer zu schützen, klicken Sie nur auf Links aus vertrauenswürdigen Quellen. Diese Seite ist möglicherweise unsicher:<br>%1<br>Möchten Sie fortfahren?",
   "DE.ApplicationController.txtPressLink": "Drücken Sie %1 und klicken Sie auf den Link",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Dieses Dokument versucht, eine Verbindung zu %1 herzustellen.<br>Wenn Sie dieser Website vertrauen, drücken Sie OK.",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Dieses Dokument versucht, den Dateidialog zu öffnen. Klicken Sie zum Öffnen auf OK.",
   "DE.ApplicationController.txtYes": "Ja",
   "DE.ApplicationController.unknownErrorText": "Unbekannter Fehler.",

apps/documenteditor/embed/locale/el.json

@@ -53,7 +53,7 @@
   "DE.ApplicationController.txtClose": "Κλείσιμο",
   "DE.ApplicationController.txtEmpty": "(Κενό)",
   "DE.ApplicationController.txtNo": "Όχι",
-  "DE.ApplicationController.txtOpenWarning": "Το κλικ σε αυτόν τον σύνδεσμο μπορεί να είναι επιβλαβές για τη συσκευή και τα δεδομένα σας. Για να προστατεύσετε τον υπολογιστή σας, κάντε κλικ μόνο σε αυτούς τους υπερσυνδέσμους από αξιόπιστες πηγές. Αυτή η τοποθεσία μπορεί να είναι ανασφαλής:<br><br>%1<br><br>Είστε σίγουροι ότι θέλετε να συνεχίσετε;",
+  "DE.ApplicationController.txtOpenWarning": "Το κλικ σε αυτόν τον υπερσύνδεσμο μπορεί να είναι επιβλαβές για τη συσκευή και τα δεδομένα σας. Για να προστατεύσετε τον υπολογιστή σας, κάντε κλικ μόνο στους υπερσυνδέσμους από αξιόπιστες πηγές. Αυτή η τοποθεσία μπορεί να μην είναι ασφαλής:<br><br>%1<br><br>Είστε σίγουροι ότι θέλετε να συνεχίσετε;",
   "DE.ApplicationController.txtPressLink": "Πατήστε %1 και κάντε κλικ στο σύνδεσμο",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Αυτό το έγγραφο προσπαθεί να ανοίξει το παράθυρο διαλόγου αρχείου, πατήστε \"Εντάξει\" για να ανοίξετε.",
   "DE.ApplicationController.txtYes": "Ναι",

apps/documenteditor/embed/locale/en.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Download failed.",
   "DE.ApplicationController.downloadTextText": "Downloading document...",
   "DE.ApplicationController.errorAccessDeny": "You are trying to perform an action you do not have rights for.<br>Please contact your Document Server administrator.",
+  "DE.ApplicationController.errorCopyDisabled": "For security reasons, the contents of this document cannot be copied.",
   "DE.ApplicationController.errorDefaultMessage": "Error code: %1",
   "DE.ApplicationController.errorEditingDownloadas": "An error occurred during the work with the document.<br>Use the 'Download as...' option to save the file backup copy to your computer hard drive.",
   "DE.ApplicationController.errorFilePassProtect": "The file is password protected and cannot be opened.",
@@ -53,7 +54,7 @@
   "DE.ApplicationController.txtClose": "Close",
   "DE.ApplicationController.txtEmpty": "(Empty)",
   "DE.ApplicationController.txtNo": "No",
-  "DE.ApplicationController.txtOpenWarning": "Clicking this link can be harmful to your device and data. To protect you computer, click only those hyperlinks from trusted sources. This location may be unsafe:<br>%1<br>Are you sure you want to continue?",
+  "DE.ApplicationController.txtOpenWarning": "Clicking this link can be harmful to your device and data. To protect you computer, click only those links from trusted sources. This location may be unsafe:<br>%1<br>Are you sure you want to continue?",
   "DE.ApplicationController.txtPressLink": "Press %1 and click link",
   "DE.ApplicationController.txtSecurityWarningLinkOk": "This document is trying to connect to %1.<br>If you trust this site, press \"OK\".",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "This document is trying to open file dialog, press \"OK\" to open.",

apps/documenteditor/embed/locale/fr.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Échec du téléchargement.",
   "DE.ApplicationController.downloadTextText": "Téléchargement du document...",
   "DE.ApplicationController.errorAccessDeny": "Vous tentez d'exéсuter une action pour laquelle vous ne disposez pas des droits.<br>Veuillez contacter l'administrateur de Document Server.",
+  "DE.ApplicationController.errorCopyDisabled": "Pour des raisons de sécurité, le contenu de ce document ne peut être copié.",
   "DE.ApplicationController.errorDefaultMessage": "Code d'erreur: %1",
   "DE.ApplicationController.errorEditingDownloadas": "Une erreur s'est produite lors du travail avec le document.<br>Utilisez l'option 'Télécharger comme...' pour enregistrer une copie de sauvegarde du fichier sur le disque dur de votre ordinateur.",
   "DE.ApplicationController.errorFilePassProtect": "Le fichier est protégé par le mot de passe et ne peut pas être ouvert.",
@@ -53,8 +54,9 @@
   "DE.ApplicationController.txtClose": "Fermer",
   "DE.ApplicationController.txtEmpty": "(Vide)",
   "DE.ApplicationController.txtNo": "Non",
-  "DE.ApplicationController.txtOpenWarning": "Cliquer sur ce lien peut endommager votre appareil et vos données. Pour protéger votre ordinateur, ne cliquez que sur les liens provenant de sources fiables. Cet emplacement peut être dangereux :<br>%1<br>Voulez-vous continuer ?",
+  "DE.ApplicationController.txtOpenWarning": "Accès via ce lien peut endommager votre appareil et vos données. Pour protéger votre ordinateur, ne cliquez que sur les liens provenant de sources fiables. Cet emplacement peut être dangereux :<br>%1<br>Voulez-vous continuer ?",
   "DE.ApplicationController.txtPressLink": "Appuyez sur %1 et cliquez sur le lien",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Ce document tente de se connecter à %1.<br>Si vous faites confiance à ce site, appuyez sur « OK ».",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Ce document tente d'ouvrir la boîte de dialogue du fichier, cliquez « OK »  pour l'ouvrir.",
   "DE.ApplicationController.txtYes": "Oui",
   "DE.ApplicationController.unknownErrorText": "Erreur inconnue.",

apps/documenteditor/embed/locale/he.json

@@ -34,6 +34,7 @@
   "DE.ApplicationController.openErrorText": ".קרתה שגיאה במהלך פתיחת הקובץ",
   "DE.ApplicationController.scriptLoadError": "החיבור איטי מדי, לא ניתן היה לטעון חלק מהרכיבים. טען מחדש את העמוד בבקשה.",
   "DE.ApplicationController.textAnonymous": "אנונימי ",
+  "DE.ApplicationController.textCancel": "ביטול",
   "DE.ApplicationController.textClear": "נקה את כל השדות",
   "DE.ApplicationController.textConvertFormDownload": "הורדת קובץ כטופס PDF שניתן למילוי.",
   "DE.ApplicationController.textCtrl": "Ctrl",
@@ -43,6 +44,7 @@
   "DE.ApplicationController.textLoadingDocument": "מוריד מסמך",
   "DE.ApplicationController.textNext": "השדה הבא",
   "DE.ApplicationController.textOf": "שֶׁל",
+  "DE.ApplicationController.textOk": "אישור",
   "DE.ApplicationController.textRequired": "מלא את כל השדות הנדרשים לשליחת הטופס.",
   "DE.ApplicationController.textSubmit": "שליחה ",
   "DE.ApplicationController.textSubmited": "<b>הטופס נשלח בהצלחה</b><br>לחץ כדי לסגור את הטיפ",
@@ -50,7 +52,10 @@
   "DE.ApplicationController.titleLicenseNotActive": "רשיון לא פעיל",
   "DE.ApplicationController.txtClose": "סגור",
   "DE.ApplicationController.txtEmpty": "(ריק)",
+  "DE.ApplicationController.txtNo": "לא",
   "DE.ApplicationController.txtPressLink": "הקש %1 ולחץ על קישור",
+  "DE.ApplicationController.txtSecurityWarningOpenFile": "מסמך זה מנסה לפתוח ד-שיח, נא ללחוץ על \"אישור\" כדי לפתוח.",
+  "DE.ApplicationController.txtYes": "כן",
   "DE.ApplicationController.unknownErrorText": "שגיאה לא ידועה.",
   "DE.ApplicationController.unsupportedBrowserErrorText": "הדפדפן שלך לא נתמך.",
   "DE.ApplicationController.waitText": "…נא המתן",

apps/documenteditor/embed/locale/it.json

@@ -53,7 +53,7 @@
   "DE.ApplicationController.txtClose": "Chiudi",
   "DE.ApplicationController.txtEmpty": "(Vuoto)",
   "DE.ApplicationController.txtNo": "No",
-  "DE.ApplicationController.txtOpenWarning": "Cliccare su questo link può danneggiare il tuo dispositivo e i tuoi dati. <br> Sei sicuro di voler continuare?",
+  "DE.ApplicationController.txtOpenWarning": "Cliccare su questo link può essere dannoso per il tuo dispositivo e i tuoi dati. Per proteggere il tuo computer, clicca solo sui link provenienti da fonti affidabili. Questa posizione potrebbe non essere sicura:<br>%1<br>Sei sicuro di voler continuare?",
   "DE.ApplicationController.txtPressLink": "Premi %1 e clicca sul collegamento",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Questo documento sta tentando di aprire la finestra di dialogo del file, premi \"OK\" per aprirla.",
   "DE.ApplicationController.txtYes": "Sì",

apps/documenteditor/embed/locale/ko.json

@@ -53,7 +53,7 @@
   "DE.ApplicationController.txtClose": "닫기",
   "DE.ApplicationController.txtEmpty": "(없음)",
   "DE.ApplicationController.txtNo": "아니오",
-  "DE.ApplicationController.txtOpenWarning": "이 링크를 클릭하는 것은 장치와 데이터에 해가 될 수 있습니다. 컴퓨터를 보호하려면 신뢰할 수 있는 출처의 하이퍼링크만 클릭하세요. 이 위치는 안전하지 않을 수 있습니다:<br>%1<br>계속하시겠습니까?",
+  "DE.ApplicationController.txtOpenWarning": "이 링크를 클릭하는 것은 장치와 데이터에 해로울 수 있습니다. 컴퓨터를 보호하려면 신뢰할 수 있는 출처의 하이퍼링크만 클릭하세요. 이 위치는 안전하지 않을 수 있습니다:<br>%1<br>계속하시겠습니까?",
   "DE.ApplicationController.txtPressLink": "%1 키를 누른 상태에서 링크 클릭",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "이 문서가 파일 대화상자를 열려고 합니다. 열려면 \"확인\"을 누르세요.",
   "DE.ApplicationController.txtYes": "네",

apps/documenteditor/embed/locale/pt.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Transferência falhou.",
   "DE.ApplicationController.downloadTextText": "Transferindo documento...",
   "DE.ApplicationController.errorAccessDeny": "Você está tentando executar uma ação para a qual não tem direitos.<br>Entre em contato com o administrador do Document Server.",
+  "DE.ApplicationController.errorCopyDisabled": "Por motivos de segurança, o conteúdo deste documento não pode ser copiado.",
   "DE.ApplicationController.errorDefaultMessage": "Código do erro: %1",
   "DE.ApplicationController.errorEditingDownloadas": "Ocorreu um erro durante o trabalho com o documento.<br>Utilizar a opção 'Download as...' para salvar a cópia de backup do arquivo no disco rígido do seu computador.",
   "DE.ApplicationController.errorFilePassProtect": "O documento é protegido por senha e não pode ser aberto.",
@@ -53,8 +54,9 @@
   "DE.ApplicationController.txtClose": "Fechar",
   "DE.ApplicationController.txtEmpty": "(Vazio)",
   "DE.ApplicationController.txtNo": "Não",
-  "DE.ApplicationController.txtOpenWarning": "Clicar neste link pode ser prejudicial ao seu dispositivo e aos seus dados.<br> Tem certeza de que deseja continuar?",
+  "DE.ApplicationController.txtOpenWarning": "Clicar neste link pode ser prejudicial ao seu dispositivo e aos seus dados. Para proteger seu computador, clique apenas em hiperlinks de fontes confiáveis. Este local pode não ser seguro:<br>%1<br>Tem certeza de que deseja continuar?",
   "DE.ApplicationController.txtPressLink": "Pressione %1 e clique no link",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Este documento está tentando se conectar a %1.<br>Se você confia neste site, pressione \"OK\".",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Este documento está tentando abrir a caixa de diálogo de arquivo, pressione \"OK\" para abrir.",
   "DE.ApplicationController.txtYes": "Sim",
   "DE.ApplicationController.unknownErrorText": "Erro desconhecido.",

apps/documenteditor/embed/locale/ro.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Descărcare eșuată.",
   "DE.ApplicationController.downloadTextText": "Descărcarea documentului...",
   "DE.ApplicationController.errorAccessDeny": "Nu aveți dreptul să efectuați acțiunea pe care doriți.<br>Contactați administratorul dumneavoastră de Server Documente.",
+  "DE.ApplicationController.errorCopyDisabled": "Din motive de securitate, conținutul acestui document nu poate fi copiat.",
   "DE.ApplicationController.errorDefaultMessage": "Codul de eroare: %1",
   "DE.ApplicationController.errorEditingDownloadas": "S-a produs o eroare în timpul editării documentului.<br>Pentru copierea de rezervă pe PC utilizați opțiunea Descărcare ca...",
   "DE.ApplicationController.errorFilePassProtect": "Fișierul este protejat cu parolă și deaceea nu poate fi deschis.",
@@ -55,6 +56,7 @@
   "DE.ApplicationController.txtNo": "Nu",
   "DE.ApplicationController.txtOpenWarning": "Accesarea acestui link poate dăuna dispozitivului sau datelor dvs. Pentru a vă proteja calculatorul, evitați să dați click pe linkuri de la surse necunoscute. Această locație poate fi nesigură:<br>%1<br>Sigur doriti sa continuati? ",
   "DE.ApplicationController.txtPressLink": "Apăsați %1 și faceți clic pe link",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Acest document încearcă să se conecteze la %1.<br>Dacă este un site de încredere, apăsați OK.",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Acest document încearcă să deschidă fereastra de dialog, apăsați OK pentru a-l deschide.",
   "DE.ApplicationController.txtYes": "Da",
   "DE.ApplicationController.unknownErrorText": "Eroare necunoscută.",

apps/documenteditor/embed/locale/ru.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Загрузка не удалась.",
   "DE.ApplicationController.downloadTextText": "Загрузка документа...",
   "DE.ApplicationController.errorAccessDeny": "Вы пытаетесь выполнить действие, на которое у вас нет прав.<br>Пожалуйста, обратитесь к администратору Сервера документов.",
+  "DE.ApplicationController.errorCopyDisabled": "В целях безопасности содержимое этого документа нельзя скопировать.",
   "DE.ApplicationController.errorDefaultMessage": "Код ошибки: %1",
   "DE.ApplicationController.errorEditingDownloadas": "В ходе работы с документом произошла ошибка.<br>Используйте опцию 'Скачать как...', чтобы сохранить резервную копию файла на жесткий диск компьютера.",
   "DE.ApplicationController.errorFilePassProtect": "Файл защищен паролем и не может быть открыт.",
@@ -55,6 +56,7 @@
   "DE.ApplicationController.txtNo": "Нет",
   "DE.ApplicationController.txtOpenWarning": "Переход по этой ссылке может нанести вред вашему устройству и данным. Чтобы защитить свой компьютер, переходите только по ссылкам из проверенных источников. Этот сайт может быть небезопасным:<br>%1<br>Вы действительно хотите продолжить?",
   "DE.ApplicationController.txtPressLink": "Нажмите %1 и щелкните по ссылке",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Этот документ пытается подключиться к %1.<br>Если вы доверяете этому сайту, нажмите \"ОК\".",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Этот документ пытается открыть диалоговое окно файла, нажмите \"OK\", чтобы открыть.",
   "DE.ApplicationController.txtYes": "Да",
   "DE.ApplicationController.unknownErrorText": "Неизвестная ошибка.",

apps/documenteditor/embed/locale/sq.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Sharkimi dështoi.",
   "DE.ApplicationController.downloadTextText": "Dokumenti po shkarkohet...",
   "DE.ApplicationController.errorAccessDeny": "Ju po përpiqeni të kryeni një veprim për të cilin nuk keni të drejta.<br>Ju lutem, kontaktoni administratorin e serverit të dokumenteve. ",
+  "DE.ApplicationController.errorCopyDisabled": "Për arsye sigurie, përmbajtja e këtij dokumenti nuk mund të kopjohet.",
   "DE.ApplicationController.errorDefaultMessage": "Kodi gabim: %1",
   "DE.ApplicationController.errorEditingDownloadas": "Ndodhi një gabim gjatë punës me dokumentin.<br>Përdorni opsionin 'Shkarko si...' për të ruajtur kopjen rezervë të skedarit në hard diskun e kompjuterit tuaj.",
   "DE.ApplicationController.errorFilePassProtect": "Skedari eshte i mbrojtuar me fjalëkalim dhe nuk mund të hapet.",
@@ -55,6 +56,7 @@
   "DE.ApplicationController.txtNo": "Jo",
   "DE.ApplicationController.txtOpenWarning": "Klikimi i kësaj lidhjeje mund të jetë i dëmshëm për pajisjen dhe të dhënat tuaja. Për të mbrojtur kompjuterin tuaj, klikoni vetëm ato hiperlidhje nga burime të besueshme. Kjo vendndodhje mund të jetë e pasigurt:<br>%1<br>A jeni të sigurt që dëshironi të vazhdoni?",
   "DE.ApplicationController.txtPressLink": "Shtypni %1 dhe klikoni lidhjen.",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Ky dokument po përpiqet të lidhet me %1.<br>Nëse i besoni kësaj faqeje, shtypni \"Në rregull\".",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Ky dokument po përpiqet të hapë dialogun e skedarit, shtypni \"OK\" për ta hapur.",
   "DE.ApplicationController.txtYes": "Po",
   "DE.ApplicationController.unknownErrorText": "Gabim i panjohur",

apps/documenteditor/embed/locale/sr.json

@@ -14,6 +14,7 @@
   "DE.ApplicationController.downloadErrorText": "Preuzimanje neuspešno.",
   "DE.ApplicationController.downloadTextText": "Preuzimanje dokumenta...",
   "DE.ApplicationController.errorAccessDeny": "Pokušavate da izvedete akciju na koju nemate prava.<br>Molimo kontaktirajte svog Dokument Server administratora.",
+  "DE.ApplicationController.errorCopyDisabled": "Zbog sigurnosnih razloga, sadržaj ovog dokumenta ne može biti kopiran.",
   "DE.ApplicationController.errorDefaultMessage": "Greška kod: %1",
   "DE.ApplicationController.errorEditingDownloadas": "Pojavila se greška u toku rada sa dokumentom.<br>Koristite \"Preuzmi kao...\" opciju da sačuvate rezervnu kopiju fajla na hard drajv vašeg kompjutera.",
   "DE.ApplicationController.errorFilePassProtect": "Fajl je zaštićen lozinkom i ne može biti otvoren.",
@@ -53,8 +54,9 @@
   "DE.ApplicationController.txtClose": "Zatvori",
   "DE.ApplicationController.txtEmpty": "(Prazno)",
   "DE.ApplicationController.txtNo": "Ne",
-  "DE.ApplicationController.txtOpenWarning": "Klik na ovaj link može biti štetan za vaš uređaj i podatke. Da biste zaštitili svoj računar, klikćite samo na hiperveze koje dolaze iz pouzdanih izvora. Ova lokacija može biti nesigurna:<br><br>{0}<br><br>Da li ste sigurni da želite da nastavite?",
+  "DE.ApplicationController.txtOpenWarning": "Klik na ovaj link može biti štetan za vaš uređaj i podatke. Da biste zaštitili svoj računar, klikćite samo na hiperveze koje dolaze iz pouzdanih izvora. Ova lokacija može biti nesigurna:<br><br>%1<br><br>Da li ste sigurni da želite da nastavite?",
   "DE.ApplicationController.txtPressLink": "Pritisni %1 i klikni link",
+  "DE.ApplicationController.txtSecurityWarningLinkOk": "Ovaj dokument pokušava da se poveže sa %1.<br>Ako verujete ovoj veb lokaciji, pritisnite „OK“.",
   "DE.ApplicationController.txtSecurityWarningOpenFile": "Ovaj dokument pokušava da otvori dijalog fajla, pritisnite \"OK\" da otvorite.",
   "DE.ApplicationController.txtYes": "Da",
   "DE.ApplicationController.unknownErrorText": "Nepoznata greška.",

apps/documenteditor/embed/locale/vi.json

@@ -1,35 +1,74 @@
 {
-  "common.view.modals.txtCopy": "Sao chép vào khay nhớ tạm",
+  "common.view.modals.txtCopy": "Sao chép vào bộ nhớ tạm",
   "common.view.modals.txtEmbed": "Nhúng",
   "common.view.modals.txtHeight": "Chiều cao",
+  "common.view.modals.txtIncorrectPwd": "Mật khẩu không đúng",
+  "common.view.modals.txtOpenFile": "Nhập mật khẩu để mở tệp",
+  "common.view.modals.txtShare": "Chia sẻ đường liên kết",
+  "common.view.modals.txtTitleProtected": "Tệp được bảo vệ",
   "common.view.modals.txtWidth": "Chiều rộng",
+  "common.view.SearchBar.textFind": "Tìm kiếm",
+  "DE.ApplicationController.convertationErrorText": "Chuyển đổi không thành công.",
   "DE.ApplicationController.convertationTimeoutText": "Đã quá thời gian chờ chuyển đổi.",
   "DE.ApplicationController.criticalErrorTitle": "Lỗi",
-  "DE.ApplicationController.downloadErrorText": "Tải về không thành công.",
+  "DE.ApplicationController.downloadErrorText": "Tải xuống không thành công.",
   "DE.ApplicationController.downloadTextText": "Đang tải tài liệu...",
   "DE.ApplicationController.errorAccessDeny": "Bạn đang cố gắng thực hiện hành động mà bạn không có quyền.<br>Vui lòng liên hệ với quản trị viên Server Tài liệu của bạn.",
   "DE.ApplicationController.errorDefaultMessage": "Mã lỗi: %1",
+  "DE.ApplicationController.errorEditingDownloadas": "Đã xảy ra lỗi trong quá trình làm việc với tài liệu.<br>Hãy sử dụng tùy chọn 'Tải xuống dưới dạng...' để lưu bản sao lưu tệp vào ổ cứng máy tính của bạn.",
   "DE.ApplicationController.errorFilePassProtect": "Tài liệu được bảo vệ bằng mật khẩu và không thể mở được.",
+  "DE.ApplicationController.errorFileSizeExceed": "Kích thước tệp vượt quá giới hạn được đặt cho máy chủ của bạn.<br>Vui lòng liên hệ với quản trị viên Máy Chủ Tài Liệu của bạn để biết chi tiết.",
+  "DE.ApplicationController.errorForceSave": "Đã xảy ra lỗi khi lưu tệp. Vui lòng sử dụng tùy chọn 'Tải xuống dưới dạng' để lưu tệp vào ổ cứng máy tính của bạn hoặc thử lại sau.",
   "DE.ApplicationController.errorInconsistentExt": "Đã xảy ra lỗi khi mở tệp.<br>Nội dung tệp không khớp với phần mở rộng tệp.",
   "DE.ApplicationController.errorInconsistentExtDocx": "Đã xảy ra lỗi khi mở tệp.<br>Nội dung tệp tương ứng với tài liệu văn bản (ví dụ: docx), nhưng tệp có phần mở rộng không nhất quán: %1.",
   "DE.ApplicationController.errorInconsistentExtPdf": "Xảy ra lỗi khi mở tệp.<br>Nội dung tệp tương ứng với một trong các định dạng sau: pdf/djvu/xps/oxps, nhưng tệp có phần mở rộng không nhất quán: %1.",
   "DE.ApplicationController.errorInconsistentExtPptx": "Đã xảy ra lỗi khi mở tệp.<br>Nội dung tệp tương ứng với bản trình bày (ví dụ: pptx), nhưng tệp có phần mở rộng không nhất quán: %1.",
   "DE.ApplicationController.errorInconsistentExtXlsx": "Đã xảy ra lỗi khi mở tệp.<br>Nội dung tệp tương ứng với bảng tính (ví dụ: xlsx), nhưng tệp có phần mở rộng không nhất quán: %1.",
+  "DE.ApplicationController.errorLoadingFont": "Phông chữ không được tải.<br>Vui lòng liên hệ với quản trị viên Máy Chủ Tài Liệu của bạn.",
+  "DE.ApplicationController.errorSubmit": "Gửi không thành công.",
+  "DE.ApplicationController.errorToken": "Token bảo mật tài liệu không được định dạng chính xác.<br>Vui lòng liên hệ với quản trị viên Máy Chủ Tài Liệu của bạn.",
+  "DE.ApplicationController.errorTokenExpire": "Token bảo mật tài liệu đã hết hạn.<br>Vui lòng liên hệ với quản trị viên Máy Chủ Tài Liệu của bạn.",
+  "DE.ApplicationController.errorUpdateVersionOnDisconnect": "Kết nối đã được khôi phục và phiên bản tệp đã được thay đổi.<br>Trước khi có thể tiếp tục làm việc, bạn cần tải xuống tệp hoặc sao chép nội dung của tệp để đảm bảo không có gì bị mất, sau đó tải lại trang này.",
   "DE.ApplicationController.errorUserDrop": "Không thể truy cập file ngay lúc này.",
   "DE.ApplicationController.notcriticalErrorTitle": "Cảnh báo",
   "DE.ApplicationController.openErrorText": "Xảy ra lỗi khi mở tệp",
+  "DE.ApplicationController.scriptLoadError": "Kết nối quá chậm, không thể tải một số thành phần. Vui lòng tải lại trang.",
   "DE.ApplicationController.textAnonymous": "Ẩn danh",
-  "DE.ApplicationController.textDownloadPdf": "Tải về PDF",
+  "DE.ApplicationController.textCancel": "Hủy",
+  "DE.ApplicationController.textClear": "Xóa tất cả các trường",
+  "DE.ApplicationController.textConvertFormDownload": "Tải xuống tệp dưới dạng PDF có thể điền để có thể điền vào.",
+  "DE.ApplicationController.textCtrl": "Ctrl",
+  "DE.ApplicationController.textDownloadPdf": "Tải xuống PDF",
+  "DE.ApplicationController.textGotIt": "Hiểu rồi",
+  "DE.ApplicationController.textGuest": "Khách",
   "DE.ApplicationController.textLoadingDocument": "Đang tải tài liệu",
-  "DE.ApplicationController.textOf": "trên",
+  "DE.ApplicationController.textNext": "Trường tiếp theo",
+  "DE.ApplicationController.textOf": "của",
+  "DE.ApplicationController.textOk": "OK",
+  "DE.ApplicationController.textRequired": "Điền vào tất cả các trường bắt buộc để gửi biểu mẫu.",
+  "DE.ApplicationController.textSubmit": "Gửi",
   "DE.ApplicationController.textSubmited": "<b>Đã gửi biểu mẫu thành công</b><br>Bấm để đóng hộp thoại",
+  "DE.ApplicationController.titleLicenseExp": "Giấy phép hết hạn",
+  "DE.ApplicationController.titleLicenseNotActive": "Giấy phép không có hiệu lực",
   "DE.ApplicationController.txtClose": "Đóng",
   "DE.ApplicationController.txtEmpty": "(Trống)",
+  "DE.ApplicationController.txtNo": "Không",
+  "DE.ApplicationController.txtOpenWarning": "Việc nhấp vào liên kết này có thể gây hại cho thiết bị và dữ liệu của bạn. Để bảo vệ máy tính của bạn, chỉ nhấp vào các liên kết đó từ các nguồn đáng tin cậy. Vị trí này có thể không an toàn:<br>%1<br>Bạn có chắc chắn muốn tiếp tục không?",
+  "DE.ApplicationController.txtPressLink": "Nhấn %1 và nhấp vào liên kết",
+  "DE.ApplicationController.txtSecurityWarningOpenFile": "Tài liệu này đang cố gắng mở hộp thoại tập tin, nhấn \"OK\" để mở.",
+  "DE.ApplicationController.txtYes": "Có",
   "DE.ApplicationController.unknownErrorText": "Lỗi không xác định.",
   "DE.ApplicationController.unsupportedBrowserErrorText": "Trình duyệt của bạn không được hỗ trợ.",
+  "DE.ApplicationController.waitText": "Vui lòng chờ...",
+  "DE.ApplicationController.warnLicenseBefore": "Giấy phép không hoạt động. Vui lòng liên hệ với quản trị viên của bạn.",
+  "DE.ApplicationController.warnLicenseExp": "Giấy phép của bạn đã hết hạn. Vui lòng cập nhật giấy phép của bạn và làm mới trang.",
   "DE.ApplicationView.txtDownload": "Tải về",
   "DE.ApplicationView.txtDownloadDocx": "Tải xuống như DOCX",
   "DE.ApplicationView.txtDownloadPdf": "Tải xuống như PDF",
+  "DE.ApplicationView.txtEmbed": "Nhúng",
+  "DE.ApplicationView.txtFileLocation": "Mở vị trí tệp",
   "DE.ApplicationView.txtFullScreen": "Toàn màn hình",
+  "DE.ApplicationView.txtPrint": "In",
+  "DE.ApplicationView.txtSearch": "Tìm kiếm",
   "DE.ApplicationView.txtShare": "Chia sẻ"
 }