@ui5/webcomponents 0.0.0-e818f286e → 0.0.0-ee3bbe46b

package/dist/SegmentedButton.js

@@ -22,9 +22,8 @@ import SegmentedButtonCss from "./generated/themes/SegmentedButton.css.js";
  */
 const metadata = {
 	tag: "ui5-segmented-button",
-	altTag: "ui5-segmentedbutton",
 	languageAware: true,
-	properties: /** @lends sap.ui.webcomponents.main.SegmentedButton.prototype */  {
+	properties: /** @lends sap.ui.webc.main.SegmentedButton.prototype */  {
 		/**
 		 * Defines the accessible ARIA name of the component.
 		 *
@@ -39,7 +38,7 @@ const metadata = {
 		},
 	},
 	managedSlots: true,
-	slots: /** @lends sap.ui.webcomponents.main.SegmentedButton.prototype */ {
+	slots: /** @lends sap.ui.webc.main.SegmentedButton.prototype */ {
 
 		/**
 		 * Defines the items of <code>ui5-segmented-button</code>.
@@ -47,7 +46,7 @@ const metadata = {
 		 * <b>Note:</b> Multiple items are allowed.
 		 * <br><br>
 		 * <b>Note:</b> Use the <code>ui5-segmented-button-item</code> for the intended design.
-		 * @type {sap.ui.webcomponents.main.ISegmentedButtonItem[]}
+		 * @type {sap.ui.webc.main.ISegmentedButtonItem[]}
 		 * @slot items
 		 * @public
 		 */
@@ -56,12 +55,12 @@ const metadata = {
 			type: HTMLElement,
 		},
 	},
-	events: /** @lends sap.ui.webcomponents.main.SegmentedButton.prototype */ {
+	events: /** @lends sap.ui.webc.main.SegmentedButton.prototype */ {
 
 		/**
 		 * Fired when the selected item changes.
 		 *
-		 * @event sap.ui.webcomponents.main.SegmentedButton#selection-change
+		 * @event sap.ui.webc.main.SegmentedButton#selection-change
 		 * @param {HTMLElement} selectedItem the pressed item.
 		 * @public
 		 */
@@ -90,8 +89,8 @@ const metadata = {
  *
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.main.SegmentedButton
- * @extends sap.ui.webcomponents.base.UI5Element
+ * @alias sap.ui.webc.main.SegmentedButton
+ * @extends sap.ui.webc.base.UI5Element
  * @tagname ui5-segmented-button
  * @since 1.0.0-rc.6
  * @appenddocs SegmentedButtonItem
@@ -273,7 +272,7 @@ class SegmentedButton extends UI5Element {
 	 * Currently selected item.
 	 *
 	 * @readonly
-	 * @type { sap.ui.webcomponents.main.ISegmentedButtonItem }
+	 * @type {sap.ui.webc.main.ISegmentedButtonItem}
 	 * @public
 	 */
 	get selectedItem() {

package/dist/SegmentedButtonItem.js

@@ -10,11 +10,11 @@ import { SEGMENTEDBUTTONITEM_ARIA_DESCRIPTION } from "./generated/i18n/i18n-defa
  */
 const metadata = {
 	tag: "ui5-segmented-button-item",
-	properties: /** @lends sap.ui.webcomponents.main.SegmentedButtonItem.prototype */ {
+	properties: /** @lends sap.ui.webc.main.SegmentedButtonItem.prototype */ {
 		/**
 		 * <b>Note:</b> The property is inherited and not supported. If set, it won't take any effect.
 		 *
-		 * @type {ButtonDesign}
+		 * @type {sap.ui.webc.main.types.ButtonDesign}
 		 * @defaultvalue "Default"
 		 * @public
 		 */
@@ -85,10 +85,10 @@ const metadata = {
  *
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.main.SegmentedButtonItem
- * @extends ToggleButton
+ * @alias sap.ui.webc.main.SegmentedButtonItem
+ * @extends sap.ui.webc.main.ToggleButton
  * @tagname ui5-segmented-button-item
- * @implements sap.ui.webcomponents.main.ISegmentedButtonItem
+ * @implements sap.ui.webc.main.ISegmentedButtonItem
  * @public
  */
 class SegmentedButtonItem extends ToggleButton {

package/dist/Select.js

@@ -64,7 +64,7 @@ const metadata = {
 	tag: "ui5-select",
 	languageAware: true,
 	managedSlots: true,
-	slots: /** @lends sap.ui.webcomponents.main.Select.prototype */ {
+	slots: /** @lends sap.ui.webc.main.Select.prototype */ {
 
 		/**
 		 * Defines the component options.
@@ -75,7 +75,7 @@ const metadata = {
 		 *
 		 * <br><br>
 		 * <b>Note:</b> Use the <code>ui5-option</code> component to define the desired options.
-		 * @type {sap.ui.webcomponents.main.ISelectOption[]}
+		 * @type {sap.ui.webc.main.ISelectOption[]}
 		 * @slot options
 		 * @public
 		 */
@@ -113,7 +113,7 @@ const metadata = {
 			type: HTMLElement,
 		},
 	},
-	properties: /** @lends sap.ui.webcomponents.main.Select.prototype */  {
+	properties: /** @lends sap.ui.webc.main.Select.prototype */  {
 
 		/**
 		 * Defines whether the component is in disabled state.
@@ -161,7 +161,7 @@ const metadata = {
 		 * <li><code>Information</code></li>
 		 * </ul>
 		 *
-		 * @type {ValueState}
+		 * @type {sap.ui.webc.base.types.ValueState}
 		 * @defaultvalue "None"
 		 * @public
 		 */
@@ -237,7 +237,7 @@ const metadata = {
 			type: Boolean,
 		},
 	},
-	events: /** @lends sap.ui.webcomponents.main.Select.prototype */ {
+	events: /** @lends sap.ui.webc.main.Select.prototype */ {
 		/**
 		 * Fired when the selected option changes.
 		 *
@@ -279,8 +279,8 @@ const metadata = {
  * <code>import "@ui5/webcomponents/dist/Option";</code> (comes with <code>ui5-select</code>)
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.main.Select
- * @extends sap.ui.webcomponents.base.UI5Element
+ * @alias sap.ui.webc.main.Select
+ * @extends sap.ui.webc.base.UI5Element
  * @tagname ui5-select
  * @appenddocs Option
  * @public
@@ -358,9 +358,9 @@ class Select extends UI5Element {
 	}
 
 	/**
-	 * Currently selected option.
+	 * Currently selected <code>ui5-option</code> element.
 	 * @readonly
-	 * @type { sap.ui.webcomponents.main.ISelectOption }
+	 * @type {sap.ui.webc.main.ISelectOption}
 	 * @public
 	 */
 	get selectedOption() {
@@ -641,7 +641,6 @@ class Select extends UI5Element {
 	_beforeOpen() {
 		this._selectedIndexBeforeOpen = this._selectedIndex;
 		this._lastSelectedOption = this._filteredItems[this._selectedIndex];
-		this.focused = false;
 	}
 
 	_afterOpen() {
@@ -650,7 +649,6 @@ class Select extends UI5Element {
 
 	_afterClose() {
 		this.opened = false;
-		this.focused = true;
 		this._iconPressed = false;
 		this._listWidth = 0;
 

package/dist/Slider.js

@@ -19,12 +19,14 @@ const metadata = {
 	tag: "ui5-slider",
 	languageAware: true,
 	managedSlots: true,
-	properties: /** @lends sap.ui.webcomponents.main.Slider.prototype */  {
+	properties: /** @lends sap.ui.webc.main.Slider.prototype */  {
 		/**
 		 * Current value of the slider
 		 *
-		 * @type {Float}
+		 * @type {sap.ui.webc.base.types.Float}
 		 * @defaultvalue 0
+		 * @formEvents change input
+		 * @formProperty
 		 * @public
 		 */
 		value: {
@@ -98,8 +100,8 @@ const metadata = {
  *
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.main.Slider
- * @extends SliderBase
+ * @alias sap.ui.webc.main.Slider
+ * @extends sap.ui.webc.main.SliderBase
  * @tagname ui5-slider
  * @since 1.0.0-rc.11
  * @public
@@ -127,7 +129,7 @@ class Slider extends SliderBase {
 	 *
 	 * Check if the previously saved state is outdated. That would mean
 	 * either it is the initial rendering or that a property has been changed
-	 * programatically - because the previous state is always updated in
+	 * programmatically - because the previous state is always updated in
 	 * the interaction handlers.
 	 *
 	 * Normalize current properties, update the previously stored state.

package/dist/SliderBase.js

@@ -4,7 +4,7 @@ import Float from "@ui5/webcomponents-base/dist/types/Float.js";
 import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
 import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
-import "@ui5/webcomponents-icons/dist/source-code.js";
+import "@ui5/webcomponents-icons/dist/direction-arrows.js";
 import {
 	isEscape, isHome, isEnd, isUp, isDown, isRight, isLeft, isUpCtrl, isDownCtrl, isRightCtrl, isLeftCtrl, isPlus, isMinus, isPageUp, isPageDown,
 } from "@ui5/webcomponents-base/dist/Keys.js";
@@ -16,11 +16,11 @@ import styles from "./generated/themes/SliderBase.css.js";
  * @public
  */
 const metadata = {
-	properties: /** @lends sap.ui.webcomponents.main.SliderBase.prototype */  {
+	properties: /** @lends sap.ui.webc.main.SliderBase.prototype */  {
 		/**
 		 * Defines the minimum value of the slider.
 		 *
-		 * @type {Float}
+		 * @type {sap.ui.webc.base.types.Float}
 		 * @defaultvalue 0
 		 * @public
 		 */
@@ -31,7 +31,7 @@ const metadata = {
 		/**
 		 * Defines the maximum value of the slider.
 		 *
-		 * @type {Float}
+		 * @type {sap.ui.webc.base.types.Float}
 		 * @defaultvalue 100
 		 * @public
 		 */
@@ -44,7 +44,7 @@ const metadata = {
 		 * <br><br>
 		 * <b>Note:</b> If set to 0 the slider handle movement is disabled. When negative number or value other than a number, the component fallbacks to its default value.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webc.base.types.Integer}
 		 * @defaultvalue 1
 		 * @public
 		 */
@@ -59,7 +59,7 @@ const metadata = {
 		 * Example - if the step value is set to 2 and the label interval is also specified to 2 - then every second
 		 * tickmark will be labelled, which means every 4th value number.
 		 *
-		 * @type {Integer}
+		 * @type {sap.ui.webc.base.types.Integer}
 		 * @defaultvalue 0
 		 * @public
 		 */
@@ -126,7 +126,7 @@ const metadata = {
 			type: Boolean,
 		},
 	},
-	events: /** @lends sap.ui.webcomponents.main.SliderBase.prototype */ {
+	events: /** @lends sap.ui.webc.main.SliderBase.prototype */ {
 		/**
 		 * Fired when the value changes and the user has finished interacting with the slider.
 		 *
@@ -152,8 +152,8 @@ const metadata = {
  *
  * @constructor
  * @author SAP SE
- * @alias sap.ui.webcomponents.main.SliderBase
- * @extends sap.ui.webcomponents.base.UI5Element
+ * @alias sap.ui.webc.main.SliderBase
+ * @extends sap.ui.webc.base.UI5Element
  * @tagname ui5-slider
  * @public
  */
@@ -587,7 +587,7 @@ class SliderBase extends UI5Element {
 		if (this.isPropertyUpdated("min", "max", ...values)) {
 			this.storePropertyState("min", "max");
 
-			// Here the value props are changed programatically (not by user interaction)
+			// Here the value props are changed programmatically (not by user interaction)
 			// and it won't be "stepified" (rounded to the nearest step). 'Clip' them within
 			// min and max bounderies and update the previous state reference.
 			values.forEach(valueType => {
@@ -614,7 +614,7 @@ class SliderBase extends UI5Element {
 	 * current state is changed due to a user action.
 	 *
 	 * Check if the previously saved state is outdated. That would mean
-	 * a property has been changed programatically because the previous state
+	 * a property has been changed programmatically because the previous state
 	 * is always updated in the interaction handlers.
 	 *
 	 * Will return true if any of the properties is not equal to its previously

package/dist/SplitButton.d.ts

@@ -0,0 +1,220 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
+import ButtonDesign from "./types/ButtonDesign.js";
+import Button from "./Button.js";
+/**
+ * @class
+ *
+ * <h3 class="comment-api-title">Overview</h3>
+ *
+ * <code>ui5-split-button</code> enables users to trigger actions. It is constructed of two separate actions -
+ * default action and arrow action that can be activated by clicking or tapping, or by
+ * pressing certain keyboard keys - <code>Space</code> or <code>Enter</code> for default action,
+ * and <code>Arrow Down</code> or <code>Arrow Up</code> for arrow action.
+ *
+ * <h3>Usage</h3>
+ *
+ * <code>ui5-split-button</code> consists two separate buttons:
+ * <ul>
+ * <li>for the first one (default action) you can define some <code>text</code> or an <code>icon</code>, or both.
+ * Also, it is possible to define different icon for active state of this button - <code>activeIcon</code>.</li>
+ * <li>the second one (arrow action) contains only <code>slim-arrow-down</code> icon.</li>
+ * </ul>
+ * You can choose a <code>design</code> from a set of predefined types (the same as for ui5-button) that offer
+ * different styling to correspond to the triggered action. Both text and arrow actions have the same design.
+ * <br><br>
+ * You can set the <code>ui5-split-button</code> as enabled or disabled. Both parts of an enabled
+ * <code>ui5-split-button</code> can be pressed by clicking or tapping it, or by certain keys, which changes
+ * the style to provide visual feedback to the user that it is pressed or hovered over with
+ * the mouse cursor. A disabled <code>ui5-split-button</code> appears inactive and any of the two buttons
+ * cannot be pressed.
+ *
+ * <h3>Keyboard Handling</h3>
+ * <ul>
+ * <li><code>Space</code> or <code>Enter</code> - triggers the default action</li>
+ * <li><code>Shift</code> or <code>Escape</code> - if <code>Space</code> is pressed, releases the default action button without triggering the click event.</li>
+ * <li><code>Arrow Down</code>, <code>Arrow Up</code>, <code>Alt</code>+<code>Arrow Down</code>, <code>Alt</code>+<code>Arrow Up</code>, or <code>F4</code> - triggers the arrow action
+ * There are separate events that are fired on activating of <code>ui5-split-button</code> parts:
+ * <ul>
+ * <li><code>click</code> for the first button (default action)</li>
+ * <li><code>arrow-click</code> for the second button (arrow action)</li>
+ * </ul>
+ * </ul>
+ *
+ * <h3>ES6 Module Import</h3>
+ *
+ * <code>import "@ui5/webcomponents/dist/SplitButton.js";</code>
+ *
+ * @constructor
+ * @author SAP SE
+ * @alias sap.ui.webc.main.SplitButton
+ * @extends sap.ui.webc.base.UI5Element
+ * @tagname ui5-split-button
+ * @public
+ * @since 1.1.0
+ */
+declare class SplitButton extends UI5Element {
+    /**
+     * Defines the icon to be displayed as graphical element within the component.
+     * The SAP-icons font provides numerous options.
+     * <br><br>
+     * Example:
+     *
+     * See all the available icons in the <ui5-link target="_blank" href="https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html" class="api-table-content-cell-link">Icon Explorer</ui5-link>.
+     *
+     * @type {string}
+     * @name sap.ui.webc.main.SplitButton.prototype.icon
+     * @defaultvalue ""
+     * @public
+     */
+    icon: string;
+    /**
+     * Defines the icon to be displayed in active state as graphical element within the component.
+     *
+     * @type {string}
+     * @name sap.ui.webc.main.SplitButton.prototype.activeIcon
+     * @defaultvalue ""
+     * @public
+     */
+    activeIcon: string;
+    /**
+     * Defines the component design.
+     *
+     * <br><br>
+     * <b>The available values are:</b>
+     *
+     * <ul>
+     * <li><code>Default</code></li>
+     * <li><code>Emphasized</code></li>
+     * <li><code>Positive</code></li>
+     * <li><code>Negative</code></li>
+     * <li><code>Transparent</code></li>
+     * <li><code>Attention</code></li>
+     * </ul>
+     *
+     * @type {sap.ui.webc.main.types.ButtonDesign}
+     * @name sap.ui.webc.main.SplitButton.prototype.design
+     * @defaultvalue "Default"
+     * @public
+     */
+    design: ButtonDesign;
+    /**
+     * Defines whether the component is disabled.
+     * A disabled component can't be pressed or
+     * focused, and it is not in the tab chain.
+     *
+     * @type {boolean}
+     * @name sap.ui.webc.main.SplitButton.prototype.disabled
+     * @defaultvalue false
+     * @public
+     */
+    disabled: boolean;
+    /**
+     * Defines the accessible ARIA name of the component.
+     *
+     * @type {string}
+     * @name sap.ui.webc.main.SplitButton.prototype.accessibleName
+     * @defaultvalue: ""
+     * @public
+     */
+    accessibleName?: string;
+    /**
+     * Indicates if the elements is on focus
+     * @type {boolean}
+     * @defaultvalue false
+     * @private
+     */
+    focused: boolean;
+    /**
+     * Accessibility-related properties for inner elements of the Split Button
+     *
+     * @type {object}
+     * @private
+     */
+    _splitButtonAccInfo: Record<string, boolean>;
+    /**
+     * Defines the tabIndex of the component.
+     * @type {string}
+     * @defaultvalue ""
+     * @private
+     */
+    _tabIndex: string;
+    /**
+     * Indicates if there is Space key pressed
+     * @type {boolean}
+     * @defaultvalue false
+     * @private
+     */
+    _spacePressed: boolean;
+    /**
+     * Indicates if there is SHIFT or ESCAPE key pressed
+     * @type {boolean}
+     * @defaultvalue false
+     * @private
+     */
+    _shiftOrEscapePressed: boolean;
+    /**
+     * Defines the active state of the text button
+     * @type {boolean}
+     * @defaultvalue false
+     * @private
+     */
+    _textButtonActive: boolean;
+    /**
+     * Defines the icon of the text button
+     * @type {string}
+     * @defaultvalue ""
+     * @private
+     */
+    _textButtonIcon: string;
+    /**
+     * Defines the active state of the arrow button
+     * @type {boolean}
+     * @defaultvalue false
+     * @private
+     */
+    _arrowButtonActive: boolean;
+    /**
+     * Defines the text of the component.
+     * <br><br>
+     * <b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
+     *
+     * @type {Node[]}
+     * @name sap.ui.webc.main.SplitButton.prototype.default
+     * @slot
+     * @public
+     */
+    text: Array<Node>;
+    _textButtonPress: {
+        handleEvent: () => void;
+        passive: boolean;
+    };
+    static i18nBundle: I18nBundle;
+    static get render(): (templateResult: object, container: HTMLElement | DocumentFragment, styleStrOrHrefsArr: string | string[] | undefined, forStaticArea: boolean, options: import("lit-html").RenderOptions) => void;
+    static get styles(): import("@ui5/webcomponents-base/src/types.js").StyleData;
+    static get template(): import("@ui5/webcomponents-base/src/renderer/executeTemplate.js").TemplateFunction;
+    static get dependencies(): (typeof Button)[];
+    static onDefine(): Promise<void>;
+    constructor();
+    onBeforeRendering(): void;
+    _onFocusOut(e: FocusEvent): void;
+    _onFocusIn(e: FocusEvent): void;
+    _onKeyDown(e: KeyboardEvent): void;
+    _onKeyUp(e: KeyboardEvent): void;
+    _fireClick(e?: Event): void;
+    _fireArrowClick(e?: Event): void;
+    _textButtonRelease(): void;
+    _setTabIndexValue(): void;
+    get textButtonAccText(): string | null;
+    get textButton(): Button | null | undefined;
+    get arrowButton(): Button | null | undefined;
+    get accessibilityInfo(): {
+        ariaExpanded: boolean;
+        ariaHaspopup: boolean;
+        description: string;
+        keyboardHint: string;
+    };
+    get ariaLabelText(): string;
+}
+export default SplitButton;