@eclipse-scout/core 22.0.1 → 22.0.11

package/src/form/fields/tabbox/TabBoxHeaderLayout.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2014-2017 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -34,14 +34,14 @@ export default class TabBoxHeaderLayout extends AbstractLayout {
     this.tabBoxHeader.invalidateLayoutTree();
   }
 
-  layout($container) { //
+  layout($container) {
     let htmlContainer = HtmlComponent.get($container),
       tabArea = this.tabBoxHeader.tabArea,
       tabAreaMargins = tabArea.htmlComp.margins(),
       tabAreaPrefSize,
       menuBar = this.tabBoxHeader.menuBar,
       menuBarMargins = menuBar.htmlComp.margins(),
-      menuBarMinumumSize,
+      menuBarMinimumSize,
       $status = this.tabBoxHeader.tabBox.$status,
       statusSizeLarge = new Dimension(),
       insets = htmlContainer.insets(),
@@ -49,7 +49,7 @@ export default class TabBoxHeaderLayout extends AbstractLayout {
         exact: true
       }).subtract(htmlContainer.insets());
 
-    menuBarMinumumSize = menuBar.htmlComp.prefSize({
+    menuBarMinimumSize = menuBar.htmlComp.prefSize({
       widthHint: 0
     });
 
@@ -59,7 +59,7 @@ export default class TabBoxHeaderLayout extends AbstractLayout {
     }
 
     tabAreaPrefSize = tabArea.htmlComp.prefSize({
-      widthHint: containerSize.width - menuBarMinumumSize.width - menuBarMargins.horizontal() - statusSizeLarge.width,
+      widthHint: containerSize.width - menuBarMinimumSize.width - menuBarMargins.horizontal() - statusSizeLarge.width,
       exact: false
     });
 

package/src/form/fields/tabbox/TabItem.js

@@ -74,4 +74,8 @@ export default class TabItem extends GroupBox {
       this.parent.setSelectedTab(this);
     }
   }
+
+  getTab() {
+    return this.parent.getTabForItem(this);
+  }
 }

package/src/form/fields/treebox/TreeBox.js

@@ -1,9 +1,9 @@
 /*
- * Copyright (c) 2014-2018 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
- * http://www.eclipse.org/legal/epl-v10.html
+ * https://www.eclipse.org/legal/epl-v10.html
  *
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
@@ -193,12 +193,13 @@ export default class TreeBox extends LookupBox {
     if (lookupRow.enabled === false) {
       node.enabled = false;
     }
-    if (lookupRow.active === false) {
-      node.active = false;
-    }
     if (lookupRow.cssClass) {
       node.cssClass = lookupRow.cssClass;
     }
+    if (lookupRow.active === false) {
+      node.active = false;
+      node.cssClass = (node.cssClass ? (node.cssClass + ' ') : '') + 'inactive';
+    }
 
     return node;
   }

package/src/glasspane/GlassPane.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -8,7 +8,7 @@
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
  */
-import {scout, Widget} from '../index';
+import {Widget} from '../index';
 import $ from 'jquery';
 
 export default class GlassPane extends Widget {
@@ -24,7 +24,7 @@ export default class GlassPane extends Widget {
 
     this.$parent.addClass('glasspane-parent');
     let cssPosition = this.$parent.css('position');
-    if (!scout.isOneOf(cssPosition, 'relative', 'absolute')) {
+    if (cssPosition === 'static') {
       this.$parent.css('position', 'relative');
     }
 

package/src/group/Group.less

@@ -44,7 +44,7 @@
   #scout.overflow-ellipsis-nowrap();
 
   .group-header:focus > & {
-    color: @active-color;
+    color: @focus-color;
     text-decoration: underline;
   }
 }

package/src/index.js

@@ -181,6 +181,7 @@ export {default as tooltips} from './tooltip/tooltips';
 export {default as WidgetTooltip} from './tooltip/WidgetTooltip';
 export {default as Action} from './action/Action';
 export {default as ActionAdapter} from './action/ActionAdapter';
+export {default as ActionExecKeyStroke} from './action/ActionExecKeyStroke';
 export {default as ActionKeyStroke} from './action/ActionKeyStroke';
 export {default as Box} from './box/Box';
 export {default as Label} from './label/Label';
@@ -308,7 +309,6 @@ export {default as TableHeaderMenu} from './table/TableHeaderMenu';
 export {default as TableHeaderMenuLayout} from './table/TableHeaderMenuLayout';
 export {default as TableHeaderMenuGroup} from './table/TableHeaderMenuGroup';
 export {default as TableHeaderMenuButton} from './table/TableHeaderMenuButton';
-export {default as TableHeaderMenuButtonKeyStroke} from './table/TableHeaderMenuButtonKeyStroke';
 export {default as TableLayout} from './table/TableLayout';
 export {default as TableSelectionHandler} from './table/TableSelectionHandler';
 export {default as TableTileGridMediator} from './table/TableTileGridMediator';

package/src/index.less

@@ -144,5 +144,6 @@
 @import "tile/fields/tablefield/TileTableField";
 @import "widget/FilterSupport";
 @import "login/LoginBox";
+@import "form/fields/breadcrumbbarfield/BreadcrumbBarField";
 @import "breadcrumbbar/BreadcrumbBar";
 @import "breadcrumbbar/BreadcrumbItem";

package/src/jquery/jquery-scout.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -834,10 +834,22 @@ $.fn.isDisplayNone = function() {
   return this.css('display') === 'none';
 };
 
+/**
+ * @param {boolean} tabbable true, to make the component tabbable. False, to make it neither tabbable nor focusable.
+ * @returns {$}
+ */
 $.fn.setTabbable = function(tabbable) {
   return this.attr('tabIndex', tabbable ? 0 : null);
 };
 
+/**
+ * @param {boolean} tabbable true, to make the component tabbable. False, to make it not tabbable but focusable, so the user can focus it with the mouse but not with the keyboard.
+ * @returns {$}
+ */
+$.fn.setTabbableOrFocusable = function(tabbable) {
+  return this.attr('tabIndex', tabbable ? 0 : -1);
+};
+
 $.fn.isTabbable = function() {
   return this.attr('tabIndex') >= 0;
 };
@@ -1049,16 +1061,17 @@ $.fn.oneAnimationEnd = function(handler) {
   if (!handler) {
     return this;
   }
-  return this.on('animationend webkitAnimationEnd', event => {
+  let oneHandler = event => {
     if (event.target !== this[0]) {
       // Ignore events that bubble up from child elements
       return;
     }
     // Unregister listener to implement "one" semantics
-    this.off(event);
+    this.off('animationend webkitAnimationEnd', oneHandler);
     // Notify actual event handler
     handler(event);
-  });
+  };
+  return this.on('animationend webkitAnimationEnd', oneHandler);
 };
 
 $.fn.hasAnimationClass = function() {

package/src/keystroke/CloseKeyStroke.js

@@ -22,6 +22,7 @@ export default class CloseKeyStroke extends KeyStroke {
       render: !!$drawingArea,
       $drawingArea: $drawingArea
     };
+    this.inheritAccessibility = false;
   }
 
   handle(event) {

package/src/keystroke/ContextMenuKeyStroke.js

@@ -24,6 +24,7 @@ export default class ContextMenuKeyStroke extends KeyStroke {
     this.ctrl = false;
     this.shift = false;
     this.stopPropagation = true;
+    this.inheritAccessibility = false;
   }
 
   /**

package/src/keystroke/FocusFilterFieldKeyStroke.js

@@ -30,6 +30,7 @@ export default class FocusFilterFieldKeyStroke extends KeyStroke {
     this.preventDefault = false; // false so that the key is inserted into the search field.
     this.keyStrokeMode = KeyStroke.Mode.DOWN;
     this.stopPropagation = true;
+    this.inheritAccessibility = false;
   }
 
   /**

package/src/keystroke/KeyStroke.js

@@ -18,6 +18,7 @@ export default class KeyStroke {
 
     this.which = []; // keys which this keystroke is bound to. Typically, this is a single key, but may be multiple keys if handling the same action (e.g. ENTER and SPACE on a button).
     this.ctrl = false;
+    this.inheritAccessibility = true;
     this.alt = false;
     this.shift = false;
     this.preventDefault = true;
@@ -138,9 +139,16 @@ export default class KeyStroke {
       if (this.field.visible !== undefined && !this.field.visible) {
         return false;
       }
-      // Check enabled state
-      if (this.field.enabled !== undefined && !this.field.enabled) {
-        return false;
+      // Check enabled state (if inheritAccessibility is true)
+      if (!this.inheritAccessibility) {
+        return true;
+      }
+      if (this.field.enabledComputed !== undefined) {
+        return this.field.enabledComputed;
+      }
+      if (this.field.enabled !== undefined) {
+        // This should actually not happen because this.field should always be a hypothetical case if this.field is not a widget
+        return this.field.enabled;
       }
     }
     return true;

package/src/keystroke/TabItemKeyStroke.js

@@ -19,15 +19,18 @@ export default class TabItemKeyStroke extends KeyStroke {
 
     this.renderingHints.offset = 16;
     this.renderingHints.hAlign = HAlign.RIGHT;
-    this.renderingHints.$drawingArea = function($drawingArea, event) {
-      return this.field.$tabContainer;
-    }.bind(this);
+    this.renderingHints.render = () => {
+      let tab = this.field.getTab();
+      return tab && tab.rendered;
+    };
+    this.renderingHints.$drawingArea = ($drawingArea, event) => this.field.getTab().$container;
+    this.inheritAccessibility = false;
   }
 
   /**
-   * @override KeyStroke.js
+   * @override
    */
   handle(event) {
-    this.field.parent.setSelectedTab(this.field);
+    this.field.select();
   }
 }

package/src/logging/logging.js

@@ -12,9 +12,16 @@ import {NullLogger, scout, URL} from '../index';
 import $ from 'jquery';
 import strings from '../util/strings';
 
-/* global log4javascript */
+const Level = {
+  TRACE: 'trace',
+  DEBUG: 'debug',
+  INFO: 'info',
+  WARN: 'warn',
+  ERROR: 'error',
+  FATAL: 'fatal'
+};
 
-const DEFAULT_LEVEL = 'trace';
+const DEFAULT_LEVEL = Level.TRACE;
 let initialized = false;
 let _appendersToAdd = [];
 let showStackTraces = true;
@@ -85,17 +92,17 @@ export function parseLevel(level) {
   }
   level = level.toLowerCase();
   switch (level) {
-    case 'trace':
+    case Level.TRACE:
       return log4javascript.Level.TRACE;
-    case 'debug':
+    case Level.DEBUG:
       return log4javascript.Level.DEBUG;
-    case 'info':
+    case Level.INFO:
       return log4javascript.Level.INFO;
-    case 'warn':
+    case Level.WARN:
       return log4javascript.Level.WARN;
-    case 'error':
+    case Level.ERROR:
       return log4javascript.Level.ERROR;
-    case 'fatal':
+    case Level.FATAL:
       return log4javascript.Level.FATAL;
   }
 }
@@ -115,6 +122,7 @@ export function addAppender(factoryName, options) {
 
 export default {
   DEFAULT_LEVEL,
+  Level,
   addAppender,
   bootstrap,
   initLog4Javascript,

package/src/login/LoginBox.js

@@ -1,9 +1,9 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
- * http://www.eclipse.org/legal/epl-v10.html
+ * https://www.eclipse.org/legal/epl-v10.html
  *
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
@@ -56,6 +56,7 @@ export default class LoginBox extends Box {
     if (this.messageKey) {
       this.$message = $('<div>')
         .attr('id', 'message-box')
+        .addClass('message-box')
         .html(strings.nl2br(this.texts.get(this.messageKey)))
         .appendTo(this.$form);
     }

package/src/login/LoginBox.less

@@ -3,7 +3,7 @@
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
- * http://www.eclipse.org/legal/epl-v10.html
+ * https://www.eclipse.org/legal/epl-v10.html
  *
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
@@ -19,6 +19,11 @@
 
   & > .button {
     margin-top: 16px;
+    margin-bottom: 0;
+  }
+
+  & > .message-box {
+    margin: 0 20px 12px 20px;
   }
 
   & > input.alternative:-webkit-autofill {
@@ -93,3 +98,15 @@
     #scout.animation(nop 0.05s);
   }
 }
+
+@media (max-width: @box-responsive-width) {
+  .login-box-content > form {
+    & > .message-box,
+    & > input,
+    & > .button {
+      width: 100%;
+      margin-left: 0;
+      margin-right: 0;
+    }
+  }
+}

package/src/menu/ContextMenuPopup.less

@@ -53,14 +53,21 @@
     &.selected {
       background-color: @item-selection-background-color;
 
+      &.has-popup {
+        color: @context-menu-item-color;
+
+        &.disabled {
+          color: @menu-item-disabled-color;
+          background-color: @item-selection-background-color;
+        }
+      }
+
       & > .submenu-icon {
         transform: none;
       }
     }
 
     &.expanded {
-      color: @active-color;
-
       & > .submenu-icon {
         #scout.submenu-icon-open();
       }

package/src/menu/Menu.less

@@ -86,6 +86,7 @@
 
   & > .text {
     #scout.overflow-ellipsis-nowrap();
+    margin-top: @text-margin-top;
   }
 
   & > .font-icon {

package/src/menu/MenuExecKeyStroke.js

@@ -8,26 +8,12 @@
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
  */
-import {keys, KeyStroke} from '../index';
+import {ActionExecKeyStroke} from '../index';
 
-export default class MenuExecKeyStroke extends KeyStroke {
+export default class MenuExecKeyStroke extends ActionExecKeyStroke {
 
   constructor(menu) {
-    super();
-    this.field = menu;
-    this.which = [keys.SPACE, keys.ENTER];
-    this.stopPropagation = true;
-
+    super(menu);
     this.renderingHints.offset = 16;
-    this.renderingHints.$drawingArea = function($drawingArea, event) {
-      return this.field.$container;
-    }.bind(this);
-  }
-
-  /**
-   * @override KeyStroke.js
-   */
-  handle(event) {
-    this.field.doAction();
   }
 }

package/src/menu/MenuNavigationKeyStroke.js

@@ -15,6 +15,7 @@ export default class MenuNavigationKeyStroke extends KeyStroke {
   constructor(popup) {
     super();
     this.field = popup;
+    this.inheritAccessibility = false;
   }
 
   _accept(event) {

package/src/menu/menubar/MenuBarLeftKeyStroke.js

@@ -12,6 +12,7 @@ import {keys, KeyStroke} from '../../index';
 
 export default class MenuBarLeftKeyStroke extends KeyStroke {
 
+  // noinspection DuplicatedCode
   constructor(menuBar) {
     super();
     this.field = menuBar;
@@ -19,6 +20,7 @@ export default class MenuBarLeftKeyStroke extends KeyStroke {
     this.renderingHints.render = false;
     this.stopPropagation = true;
     this.keyStrokeMode = KeyStroke.Mode.DOWN;
+    this.inheritAccessibility = false;
   }
 
   handle(event) {

package/src/menu/menubar/MenuBarRightKeyStroke.js

@@ -12,6 +12,7 @@ import {keys, KeyStroke} from '../../index';
 
 export default class MenuBarRightKeyStroke extends KeyStroke {
 
+  // noinspection DuplicatedCode
   constructor(menuBar) {
     super();
     this.field = menuBar;
@@ -19,6 +20,7 @@ export default class MenuBarRightKeyStroke extends KeyStroke {
     this.renderingHints.render = false;
     this.stopPropagation = true;
     this.keyStrokeMode = KeyStroke.Mode.DOWN;
+    this.inheritAccessibility = false;
   }
 
   handle(event) {

package/src/messagebox/MessageBox.less

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -22,6 +22,22 @@
     border-radius: 0;
   }
 
+  &.full-width {
+    & > .messagebox-buttons {
+      padding-left: 10px;
+      padding-right: 10px;
+
+      & > .box-button {
+        min-width: 70px; /* less min width for buttons on small screens */
+        margin-right: 8px;
+
+        &:last-child {
+          margin-right: 0;
+        }
+      }
+    }
+  }
+
   .severity-button(@color, @hover-color: darken(@color, 6%), @active-color: darken(@color, 13%), @focus-color: @focus-box-shadow-color) {
     & > .box-buttons > .box-button {
       border-color: @color;
@@ -225,23 +241,7 @@
 
 @media (max-width: @messagebox-max-width) {
   .messagebox {
-    /* reduce message box width on small screens */
-    max-width: 330px;
     /* no need to have a margin on small screens */
     margin: 0;
-
-    & > .messagebox-buttons {
-      padding-left: 10px;
-      padding-right: 10px;
-
-      & > .box-button {
-        min-width: 70px; /* less min width for buttons on small screens */
-        margin-right: 8px;
-
-        &:last-child {
-          margin-right: 0;
-        }
-      }
-    }
   }
 }

package/src/modeselector/Mode.less

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -9,10 +9,14 @@
  *     BSI Business Systems Integration AG - initial API and implementation
  */
 .mode {
-  border: @mode-border-width solid @control-border-color;
+  --padding-x: @mode-padding-x;
+  --padding-y: @mode-padding-y;
+  --border-width: @mode-border-width;
+
+  border: var(--border-width) solid @control-border-color;
   border-radius: 0;
   flex: 1 1 0;
-  padding: @mode-padding-y @mode-padding-x;
+  padding: var(--padding-y) var(--padding-x);
   #scout.overflow-ellipsis();
 
   &.first {
@@ -29,12 +33,12 @@
 
   &:not(.last):not(.selected) {
     border-right: none;
-    padding-right: @mode-padding-x + @mode-border-width; /* account for the missing border, so that text does not jump */
+    padding-right: calc(var(--padding-x) + var(--border-width)); /* account for the missing border, so that text does not jump */
   }
 
   &.after-selected {
     border-left: none;
-    padding-left: @mode-padding-x + @mode-border-width; /* account for the missing border, so that text does not jump */
+    padding-left: calc(var(--padding-x) + var(--border-width)); /* account for the missing border, so that text does not jump */
   }
 
   // override button (the selected mode cannot be clicked. therefore do not show hover and active colors)
@@ -68,28 +72,20 @@
 }
 
 .mode-selector.alternative {
-  border: @mode-alternative-border-width solid transparent;
 
   & > .mode {
+    --border-width: 0px;
+
     color: @mode-color;
-    border: none;
     background-color: transparent;
     border-radius: @button-border-radius;
 
-    &:not(.last):not(.selected) {
-      padding-right: @mode-padding-x;
-    }
-
-    &.after-selected {
-      padding-left: @mode-padding-x;
-    }
-
     &:hover {
-      background-color: rgba(0, 0, 0, 0.05);
+      background-color: @mode-alternative-hover-background-color;
     }
 
     &:active {
-      background-color: rgba(0, 0, 0, 0.1);
+      background-color: @mode-alternative-active-background-color;
     }
 
     &.selected {
@@ -120,26 +116,8 @@
 }
 
 .dense .mode-selector {
-
   & > .mode {
-    padding: @mode-padding-dense;
-
-    &:not(.last):not(.selected) {
-      padding-right: @mode-padding-dense-x + @mode-border-width; /* account for the missing border, so that text does not jump */
-    }
-
-    &.after-selected {
-      padding-left: @mode-padding-dense-x + @mode-border-width; /* account for the missing border, so that text does not jump */
-    }
-  }
-
-  &.alternative > .mode {
-    &:not(.last):not(.selected) {
-      padding-right: @mode-padding-dense-x;
-    }
-
-    &.after-selected {
-      padding-left: @mode-padding-dense-x;
-    }
+    --padding-x: @mode-padding-dense-x;
+    --padding-y: @mode-padding-dense-y;
   }
 }

package/src/modeselector/ModeSelector.js

@@ -133,7 +133,7 @@ export default class ModeSelector extends Widget {
     let selectedModePosX = 0, selectedModeWidth = 0;
     if (this.selectedMode && this.selectedMode.$container) {
       selectedModePosX = graphics.position(this.selectedMode.$container).x;
-      selectedModeWidth = graphics.size(this.selectedMode.$container).width;
+      selectedModeWidth = graphics.size(this.selectedMode.$container, {exact: true}).width;
     }
     this.$slider.cssLeft(selectedModePosX);
     this.$slider.cssWidth(selectedModeWidth);

package/src/modeselector/ModeSelector.less

@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -22,6 +22,7 @@
   &.alternative {
     background-color: @mode-alternative-background-color;
     border-radius: @button-border-radius;
+    border: @mode-selector-alternative-border-width solid transparent;
 
     &:not(.disabled) > .mode-slider {
       display: block;