@ui5/webcomponents 0.0.0-0a35d6b3d → 0.0.0-0dd36ca4b

package/dist/SliderBase.d.ts

@@ -8,70 +8,70 @@ type StateStorage = {
 type DirectionStart = "left" | "right";
 /**
  * Fired when the value changes and the user has finished interacting with the slider.
- *
  * @public
  */
 declare abstract class SliderBase extends UI5Element {
     /**
      * Defines the minimum value of the slider.
-     *
      * @default 0
      * @public
      */
     min: number;
     /**
      * Defines the maximum value of the slider.
-     *
      * @default 100
      * @public
      */
     max: number;
+    /**
+     * Determines the name by which the component will be identified upon submission in an HTML form.
+     *
+     * **Note:** This property is only applicable within the context of an HTML Form element.
+     * @default ""
+     * @public
+     * @since 2.0.0
+     */
+    name: string;
     /**
      * Defines the size of the slider's selection intervals (e.g. min = 0, max = 10, step = 5 would result in possible selection of the values 0, 5, 10).
-     * <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.
      *
+     * **Note:** 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.
      * @default 1
      * @public
      */
     step: number;
     /**
      * Displays a label with a value on every N-th step.
-     * <br><br>
-     * <b>Note:</b> The step and tickmarks properties must be enabled.
+     *
+     * **Note:** The step and tickmarks properties must be enabled.
      * 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.
-     *
      * @default 0
      * @public
      */
     labelInterval: number;
     /**
      * Enables tickmarks visualization for each step.
-     * <br><br>
-     * <b>Note:</b> The step must be a positive number.
      *
+     * **Note:** The step must be a positive number.
      * @default false
      * @public
      */
     showTickmarks: boolean;
     /**
      * Enables handle tooltip displaying the current value.
-     *
      * @default false
      * @public
      */
     showTooltip: boolean;
     /**
      * Defines whether the slider is in disabled state.
-     *
      * @default false
      * @public
      */
     disabled: boolean;
     /**
      * Defines the accessible ARIA name of the component.
-     *
      * @default ""
      * @public
      * @since 1.4.0
@@ -96,6 +96,7 @@ declare abstract class SliderBase extends UI5Element {
     _oldMax?: number;
     _labelWidth: number;
     _labelValues?: Array<string>;
+    formElementAnchor(): Promise<HTMLElement | undefined>;
     constructor();
     _handleMove(e: TouchEvent | MouseEvent): void;
     _handleUp(): void;
@@ -113,7 +114,7 @@ declare abstract class SliderBase extends UI5Element {
         VISIBLE: string;
         HIDDEN: string;
     };
-    static get render(): import("@ui5/webcomponents-base/dist/UI5Element.js").Renderer;
+    static get renderer(): import("@ui5/webcomponents-base/dist/UI5Element.js").Renderer;
     static get styles(): import("@ui5/webcomponents-base/dist/types.js").StyleData;
     get classes(): {
         root: {
@@ -126,14 +127,12 @@ declare abstract class SliderBase extends UI5Element {
     onEnterDOM(): void;
     onExitDOM(): void;
     onAfterRendering(): void;
-    /** Shows the tooltip(s) if the <code>showTooltip</code> property is set to true
-     *
+    /** Shows the tooltip(s) if the `showTooltip` property is set to true
      * @private
      */
     _onmouseover(): void;
     /**
-     * Hides the tooltip(s) if the <code>showTooltip</code> property is set to true
-     *
+     * Hides the tooltip(s) if the `showTooltip` property is set to true
      * @private
      */
     _onmouseout(): void;
@@ -141,19 +140,16 @@ declare abstract class SliderBase extends UI5Element {
     _onkeyup(): void;
     /**
      * Flags if an inner element is currently being focused
-     *
      * @private
      */
     _preserveFocus(isFocusing: boolean): void;
     /**
      * Return if an inside element within the component is currently being focused
-     *
      * @private
      */
     _isFocusing(): boolean;
     /**
      * Prevent focus out when inner element within the component is currently being in process of focusing in.
-     *
      * @private
      */
     _preventFocusOut(): void;
@@ -164,7 +160,6 @@ declare abstract class SliderBase extends UI5Element {
     focusInnerElement(): void;
     /**
      * Handle the responsiveness of the Slider's UI elements when resizing
-     *
      * @private
      */
     _handleResize(): void;
@@ -172,64 +167,54 @@ declare abstract class SliderBase extends UI5Element {
      * Called when the user starts interacting with the slider.
      * After a down event on the slider root, listen for move events on window, so the slider value
      * is updated even if the user drags the pointer outside the slider root.
-     *
      * @protected
      */
     handleDownBase(e: TouchEvent | MouseEvent): number;
     /**
      * Forward the focus to an inner inner part within the component on press
-     *
      * @private
      */
     _handleFocusOnMouseDown(e: TouchEvent | MouseEvent): void;
     /**
      * Called when the user finish interacting with the slider
-     * Fires an <code>change</code> event indicating a final value change, after user interaction is finished.
-     *
+     * Fires an `change` event indicating a final value change, after user interaction is finished.
      * @protected
      */
     handleUpBase(): void;
     /**
      * Updates state storage for the value-related property
-     * Fires an <code>input</code> event indicating a value change via interaction that is not yet finished.
-     *
+     * Fires an `input` event indicating a value change via interaction that is not yet finished.
      * @protected
      */
     updateStateStorageAndFireInputEvent(valueType: string): void;
     /**
      * Goes through the key shortcuts available for the component and returns 'true' if the event is triggered by one.
-     *
      * @private
      */
     static _isActionKey(e: KeyboardEvent): boolean;
     /**
      * Locks the given value between min and max boundaries based on slider properties
-     *
      * @protected
      */
     static clipValue(value: number, min: number, max: number): number;
     /**
      * Sets the slider value from an event
-     *
      * @protected
      */
     static getValueFromInteraction(e: TouchEvent | MouseEvent, stepSize: number, min: number, max: number, boundingClientRect: DOMRect, directionStart: DirectionStart): number;
     /**
      * "Stepify" the raw value - calculate the new value depending on the specified step property
-     *
      * @protected
      */
     static getSteppedValue(value: number, stepSize: number, min: number): number;
     /**
      * Gets pageX value from event on user interaction with the Slider
-     *
      * @protected
      */
     static getPageXValueFromEvent(e: TouchEvent | MouseEvent): number;
     /**
      * Computes the new value (in %) from the pageX position of the cursor.
      * Returns the value rounded to a precision of at most 2 digits after decimal point.
-     *
      * @protected
      */
     static computedValueFromPageX(pageX: number, min: number, max: number, boundingClientRect: DOMRect, directionStart: DirectionStart): number;
@@ -250,26 +235,22 @@ declare abstract class SliderBase extends UI5Element {
      *
      * Will return true if any of the properties is not equal to its previously
      * stored value.
-     *
      * @protected
      */
     isCurrentStateOutdated(): boolean;
     /**
      * Returns the last stored value of a property
-     *
      * @protected
      */
     getStoredPropertyState(prop: string): number | undefined;
     /**
      * Check if one or more properties have been updated compared to their last
      * saved values in the state storage.
-     *
      * @protected
      */
     isPropertyUpdated(...props: Array<string>): boolean;
     /**
      * Updates the previously saved in the _stateStorage values of one or more properties.
-     *
      * @protected
      */
     storePropertyState(...props: Array<string>): void;
@@ -279,7 +260,6 @@ declare abstract class SliderBase extends UI5Element {
     get directionStart(): "left" | "right";
     /**
      * Calculates the labels amount, width and text and creates them
-     *
      * @private
      */
     _createLabels(): void;
@@ -290,27 +270,24 @@ declare abstract class SliderBase extends UI5Element {
     get _tickmarksCount(): number;
     /**
      * Calculates space between tickmarks
-     *
      * @private
      */
     _spaceBetweenTickmarks(): number;
     /**
      * Notify in case of a invalid step value type
-     *
      * @private
      */
     _validateStep(step: number): void;
     get _labels(): string[];
     /**
-     * Normalizes a new <code>step</code> property value.
+     * Normalizes a new `step` property value.
      * If tickmarks are enabled recreates them according to it.
-     *
      * @private
      */
     get _effectiveStep(): number;
     get _effectiveMin(): number;
     get _effectiveMax(): number;
-    get _tabIndex(): "0" | "-1";
+    get _tabIndex(): "-1" | "0";
     get _ariaLabelledByHandleRefs(): string;
 }
 export default SliderBase;

package/dist/SliderBase.js

@@ -19,20 +19,21 @@ import { isEscape, isHome, isEnd, isUp, isDown, isRight, isLeft, isUpCtrl, isDow
 import sliderBaseStyles from "./generated/themes/SliderBase.css.js";
 /**
  * Fired when the value changes and the user has finished interacting with the slider.
- *
  * @public
  */
 let SliderBase = SliderBase_1 = 
 /**
  * @class
  *
- * <h3 class="comment-api-title">Overview</h3>
- *
+ * ### Overview
  * @constructor
  * @extends UI5Element
  * @public
  */
 class SliderBase extends UI5Element {
+    async formElementAnchor() {
+        return this.getFocusDomRefAsync();
+    }
     constructor() {
         super();
         this.notResized = false;
@@ -88,7 +89,7 @@ class SliderBase extends UI5Element {
             HIDDEN: "hidden",
         };
     }
-    static get render() {
+    static get renderer() {
         return litRender;
     }
     static get styles() {
@@ -117,8 +118,7 @@ class SliderBase extends UI5Element {
             this._resizeHandler();
         }
     }
-    /** Shows the tooltip(s) if the <code>showTooltip</code> property is set to true
-     *
+    /** Shows the tooltip(s) if the `showTooltip` property is set to true
      * @private
      */
     _onmouseover() {
@@ -127,8 +127,7 @@ class SliderBase extends UI5Element {
         }
     }
     /**
-     * Hides the tooltip(s) if the <code>showTooltip</code> property is set to true
-     *
+     * Hides the tooltip(s) if the `showTooltip` property is set to true
      * @private
      */
     _onmouseout() {
@@ -154,7 +153,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Flags if an inner element is currently being focused
-     *
      * @private
      */
     _preserveFocus(isFocusing) {
@@ -162,7 +160,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Return if an inside element within the component is currently being focused
-     *
      * @private
      */
     _isFocusing() {
@@ -170,7 +167,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Prevent focus out when inner element within the component is currently being in process of focusing in.
-     *
      * @private
      */
     _preventFocusOut() {
@@ -185,7 +181,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Handle the responsiveness of the Slider's UI elements when resizing
-     *
      * @private
      */
     _handleResize() {
@@ -218,7 +213,6 @@ class SliderBase extends UI5Element {
      * Called when the user starts interacting with the slider.
      * After a down event on the slider root, listen for move events on window, so the slider value
      * is updated even if the user drags the pointer outside the slider root.
-     *
      * @protected
      */
     handleDownBase(e) {
@@ -244,7 +238,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Forward the focus to an inner inner part within the component on press
-     *
      * @private
      */
     _handleFocusOnMouseDown(e) {
@@ -256,8 +249,7 @@ class SliderBase extends UI5Element {
     }
     /**
      * Called when the user finish interacting with the slider
-     * Fires an <code>change</code> event indicating a final value change, after user interaction is finished.
-     *
+     * Fires an `change` event indicating a final value change, after user interaction is finished.
      * @protected
      */
     handleUpBase() {
@@ -271,8 +263,7 @@ class SliderBase extends UI5Element {
     }
     /**
      * Updates state storage for the value-related property
-     * Fires an <code>input</code> event indicating a value change via interaction that is not yet finished.
-     *
+     * Fires an `input` event indicating a value change via interaction that is not yet finished.
      * @protected
      */
     updateStateStorageAndFireInputEvent(valueType) {
@@ -283,7 +274,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Goes through the key shortcuts available for the component and returns 'true' if the event is triggered by one.
-     *
      * @private
      */
     static _isActionKey(e) {
@@ -291,7 +281,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Locks the given value between min and max boundaries based on slider properties
-     *
      * @protected
      */
     static clipValue(value, min, max) {
@@ -300,7 +289,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Sets the slider value from an event
-     *
      * @protected
      */
     static getValueFromInteraction(e, stepSize, min, max, boundingClientRect, directionStart) {
@@ -311,7 +299,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * "Stepify" the raw value - calculate the new value depending on the specified step property
-     *
      * @protected
      */
     static getSteppedValue(value, stepSize, min) {
@@ -327,7 +314,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Gets pageX value from event on user interaction with the Slider
-     *
      * @protected
      */
     static getPageXValueFromEvent(e) {
@@ -342,7 +328,6 @@ class SliderBase extends UI5Element {
     /**
      * Computes the new value (in %) from the pageX position of the cursor.
      * Returns the value rounded to a precision of at most 2 digits after decimal point.
-     *
      * @protected
      */
     static computedValueFromPageX(pageX, min, max, boundingClientRect, directionStart) {
@@ -379,7 +364,6 @@ class SliderBase extends UI5Element {
      *
      * Will return true if any of the properties is not equal to its previously
      * stored value.
-     *
      * @protected
      */
     isCurrentStateOutdated() {
@@ -387,7 +371,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Returns the last stored value of a property
-     *
      * @protected
      */
     getStoredPropertyState(prop) {
@@ -396,7 +379,6 @@ class SliderBase extends UI5Element {
     /**
      * Check if one or more properties have been updated compared to their last
      * saved values in the state storage.
-     *
      * @protected
      */
     isPropertyUpdated(...props) {
@@ -404,7 +386,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Updates the previously saved in the _stateStorage values of one or more properties.
-     *
      * @protected
      */
     storePropertyState(...props) {
@@ -420,7 +401,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Calculates the labels amount, width and text and creates them
-     *
      * @private
      */
     _createLabels() {
@@ -485,7 +465,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Calculates space between tickmarks
-     *
      * @private
      */
     _spaceBetweenTickmarks() {
@@ -493,7 +472,6 @@ class SliderBase extends UI5Element {
     }
     /**
      * Notify in case of a invalid step value type
-     *
      * @private
      */
     _validateStep(step) {
@@ -511,9 +489,8 @@ class SliderBase extends UI5Element {
         return this._labelValues || [];
     }
     /**
-     * Normalizes a new <code>step</code> property value.
+     * Normalizes a new `step` property value.
      * If tickmarks are enabled recreates them according to it.
-     *
      * @private
      */
     get _effectiveStep() {
@@ -545,6 +522,9 @@ __decorate([
 __decorate([
     property({ validator: Float, defaultValue: 100 })
 ], SliderBase.prototype, "max", void 0);
+__decorate([
+    property()
+], SliderBase.prototype, "name", void 0);
 __decorate([
     property({ validator: Float, defaultValue: 1 })
 ], SliderBase.prototype, "step", void 0);
@@ -576,7 +556,6 @@ SliderBase = SliderBase_1 = __decorate([
     event("change")
     /**
      * Fired when the value changes due to user interaction that is not yet finished - during mouse/touch dragging.
-     *
      * @public
      */
     ,
@@ -584,8 +563,7 @@ SliderBase = SliderBase_1 = __decorate([
     /**
      * @class
      *
-     * <h3 class="comment-api-title">Overview</h3>
-     *
+     * ### Overview
      * @constructor
      * @extends UI5Element
      * @public