@ui5/webcomponents 0.0.0-d9933bd82 → 0.0.0-da0d3eb88

package/dist/StandardListItem.d.ts

@@ -0,0 +1,126 @@
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import ListItem from "./ListItem.js";
+import type { IAccessibleListItem } from "./ListItem.js";
+import WrappingType from "./types/WrappingType.js";
+/**
+ * @class
+ * The `ui5-li` represents the simplest type of item for a `ui5-list`.
+ *
+ * This is a list item,
+ * providing the most common use cases such as `text`,
+ * `image` and `icon`.
+
+ * @csspart title - Used to style the title of the list item
+ * @csspart description - Used to style the description of the list item
+ * @csspart additional-text - Used to style the additionalText of the list item
+ * @csspart icon - Used to style the icon of the list item
+ * @csspart native-li - Used to style the main li tag of the list item
+ * @csspart content - Used to style the content area of the list item
+ * @csspart detail-button - Used to style the button rendered when the list item is of type detail
+ * @csspart delete-button - Used to style the button rendered when the list item is in delete mode
+ * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode
+ * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode
+ * @slot {Node[]} default - Defines the text of the component.
+ *
+ * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
+ * @constructor
+ * @extends ListItem
+ * @public
+ */
+declare class StandardListItem extends ListItem implements IAccessibleListItem {
+    /**
+     * Defines the description displayed right under the item text, if such is present.
+     * @default ""
+     * @public
+     * @since 0.8.0
+     */
+    description: string;
+    /**
+     * Defines the `icon` source URI.
+     *
+     * **Note:**
+     * SAP-icons font provides numerous built-in icons. To find all the available icons, see the
+     * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
+     * @default ""
+     * @public
+     */
+    icon: string;
+    /**
+     * Defines whether the `icon` should be displayed in the beginning of the list item or in the end.
+     *
+     * **Note:** If `image` is set, the `icon` would be displayed after the `image`.
+     * @default false
+     * @public
+     */
+    iconEnd: boolean;
+    /**
+     * Defines the `image` source URI.
+     *
+     * **Note:** The `image` would be displayed in the beginning of the list item.
+     * @default ""
+     * @public
+     */
+    image: string;
+    /**
+     * Defines the `additionalText`, displayed in the end of the list item.
+     * @default ""
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    additionalText: string;
+    /**
+     * Defines the state of the `additionalText`.
+     *
+     * Available options are: `"None"` (by default), `"Positive"`, `"Critical"`, `"Information"` and `"Negative"`.
+     * @default "None"
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    additionalTextState: `${ValueState}`;
+    /**
+     * Defines whether the item is movable.
+     * @default false
+     * @public
+     * @since 2.0.0
+     */
+    movable: boolean;
+    /**
+     * Defines the text alternative of the component.
+     * Note: If not provided a default text alternative will be set, if present.
+     * @default ""
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    accessibleName: string;
+    /**
+     * Defines if the text of the component should wrap, they truncate by default.
+     *
+     * **Note:** this property takes affect only if text node is provided to default slot of the component
+     * @default "None"
+     * @private
+     * @since 1.5.0
+     */
+    wrappingType: `${WrappingType}`;
+    /**
+     * Indicates if the list item has text content.
+     * @private
+     */
+    hasTitle: boolean;
+    _hasImageContent: boolean;
+    /**
+     * **Note:** While the slot allows option for setting custom avatar, to match the
+     * design guidelines, please use the `ui5-avatar` with it's default size - S.
+     *
+     * **Note:** If bigger `ui5-avatar` needs to be used, then the size of the
+     * `ui5-li` should be customized in order to fit.
+     * @since 1.10.0
+     * @public
+     */
+    imageContent: Array<HTMLElement>;
+    onBeforeRendering(): void;
+    get displayImage(): boolean;
+    get displayIconBegin(): boolean;
+    get displayIconEnd(): boolean;
+    get hasImageContent(): boolean;
+}
+export default StandardListItem;

package/dist/StandardListItem.js

@@ -1,160 +1,109 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
 import ListItem from "./ListItem.js";
 import Icon from "./Icon.js";
+import Avatar from "./Avatar.js";
+import WrappingType from "./types/WrappingType.js";
 import StandardListItemTemplate from "./generated/templates/StandardListItemTemplate.lit.js";
-
-/**
- * @public
- */
-const metadata = {
-	tag: "ui5-li",
-	properties: /** @lends sap.ui.webcomponents.main.StandardListItem.prototype */ {
-
-		/**
-		 * Defines the description displayed right under the item text, if such is present.
-		 * @type {string}
-		 * @defaultvalue: ""
-		 * @public
-		 * @since 0.8.0
-		 */
-		description: {
-			type: String,
-		},
-
-		/**
-		 * Defines the <code>icon</code> source URI.
-		 * <br><br>
-		 * <b>Note:</b>
-		 * SAP-icons font provides numerous buil-in icons. To find all the available icons, see the
-		 * <ui5-link target="_blank" href="https://openui5.hana.ondemand.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html" class="api-table-content-cell-link">Icon Explorer</ui5-link>.
-		 *
-		 * @type {string}
-		 * @public
-		 */
-		icon: {
-			type: String,
-		},
-
-		/**
-		 * Defines whether the <code>icon</code> should be displayed in the beginning of the list item or in the end.
-		 * <br><br>
-		 * <b>Note:</b> If <code>image</code> is set, the <code>icon</code> would be displayed after the <code>image</code>.
-		 *
-		 * @type {boolean}
-		 * @defaultvalue false
-		 * @public
-		 */
-		iconEnd: {
-			type: Boolean,
-		},
-
-		/**
-		 * Defines the <code>image</code> source URI.
-		 * <br><br>
-		 * <b>Note:</b> The <code>image</code> would be displayed in the beginning of the list item.
-		 *
-		 * @type {string}
-		 * @public
-		 */
-		image: {
-			type: String,
-		},
-
-		/**
-		 * Defines the <code>info</code>, displayed in the end of the list item.
-		 * @type {string}
-		 * @public
-		 * @since 0.13.0
-		 */
-		info: {
-			type: String,
-		},
-
-		/**
-		 * Defines the state of the <code>info</code>.
-		 * <br>
-		 * Available options are: <code>"None"</code> (by default), <code>"Success"</code>, <code>"Warning"</code> and <code>"Erorr"</code>.
-		 * @type {ValueState}
-         * @defaultvalue "None"
-		 * @public
-		 * @since 0.13.0
-		 */
-		infoState: {
-			type: ValueState,
-			defaultValue: ValueState.None,
-		},
-
-		/**
-		 * Indicates if the list item has text content.
-		 * @type {boolean}
-		 * @private
-		 */
-		hasTitle: {
-			type: Boolean,
-		},
-	},
-	slots: /** @lends sap.ui.webcomponents.main.StandardListItem.prototype */ {
-		/**
-		 * Defines the text of the <code>ui5-li</code>.
-		 * <br><br>
-		 * <b>Note:</b> Аlthough this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
-		 *
-		 * @type {Node[]}
-		 * @slot
-		 * @public
-		 */
-		"default": {
-			type: Node,
-		},
-	},
-};
-
 /**
  * @class
- * The <code>ui5-li</code> represents the simplest type of item for a <code>ui5-list</code>.
+ * The `ui5-li` represents the simplest type of item for a `ui5-list`.
  *
  * This is a list item,
- * providing the most common use cases such as <code>text</code>,
- * <code>image</code> and <code>icon</code>.
+ * providing the most common use cases such as `text`,
+ * `image` and `icon`.
+
+ * @csspart title - Used to style the title of the list item
+ * @csspart description - Used to style the description of the list item
+ * @csspart additional-text - Used to style the additionalText of the list item
+ * @csspart icon - Used to style the icon of the list item
+ * @csspart native-li - Used to style the main li tag of the list item
+ * @csspart content - Used to style the content area of the list item
+ * @csspart detail-button - Used to style the button rendered when the list item is of type detail
+ * @csspart delete-button - Used to style the button rendered when the list item is in delete mode
+ * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode
+ * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode
+ * @slot {Node[]} default - Defines the text of the component.
  *
+ * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webcomponents.main.StandardListItem
  * @extends ListItem
- * @tagname ui5-li
  * @public
  */
-class StandardListItem extends ListItem {
-	static get template() {
-		return StandardListItemTemplate;
-	}
-
-	static get metadata() {
-		return metadata;
-	}
-
-	onBeforeRendering(...params) {
-		super.onBeforeRendering(...params);
-		this.hasTitle = !!this.textContent;
-	}
-
-	get displayImage() {
-		return !!this.image;
-	}
-
-	get displayIconBegin() {
-		return (this.icon && !this.iconEnd);
-	}
-
-	get displayIconEnd() {
-		return (this.icon && this.iconEnd);
-	}
-
-	static async onDefine() {
-		await Icon.define();
-	}
-}
-
+let StandardListItem = class StandardListItem extends ListItem {
+    onBeforeRendering() {
+        super.onBeforeRendering();
+        this.hasTitle = !!this.textContent;
+        this._hasImageContent = this.hasImageContent;
+    }
+    get displayImage() {
+        return !!this.image;
+    }
+    get displayIconBegin() {
+        return !!(this.icon && !this.iconEnd);
+    }
+    get displayIconEnd() {
+        return !!(this.icon && this.iconEnd);
+    }
+    get hasImageContent() {
+        return !!this.imageContent.length;
+    }
+};
+__decorate([
+    property()
+], StandardListItem.prototype, "description", void 0);
+__decorate([
+    property()
+], StandardListItem.prototype, "icon", void 0);
+__decorate([
+    property({ type: Boolean })
+], StandardListItem.prototype, "iconEnd", void 0);
+__decorate([
+    property()
+], StandardListItem.prototype, "image", void 0);
+__decorate([
+    property()
+], StandardListItem.prototype, "additionalText", void 0);
+__decorate([
+    property({ type: ValueState, defaultValue: ValueState.None })
+], StandardListItem.prototype, "additionalTextState", void 0);
+__decorate([
+    property({ type: Boolean })
+], StandardListItem.prototype, "movable", void 0);
+__decorate([
+    property()
+], StandardListItem.prototype, "accessibleName", void 0);
+__decorate([
+    property({ type: WrappingType, defaultValue: WrappingType.None })
+], StandardListItem.prototype, "wrappingType", void 0);
+__decorate([
+    property({ type: Boolean })
+], StandardListItem.prototype, "hasTitle", void 0);
+__decorate([
+    property({ type: Boolean })
+], StandardListItem.prototype, "_hasImageContent", void 0);
+__decorate([
+    slot()
+], StandardListItem.prototype, "imageContent", void 0);
+StandardListItem = __decorate([
+    customElement({
+        tag: "ui5-li",
+        template: StandardListItemTemplate,
+        dependencies: [
+            ...ListItem.dependencies,
+            Icon,
+            Avatar,
+        ],
+    })
+], StandardListItem);
 StandardListItem.define();
-
 export default StandardListItem;
+//# sourceMappingURL=StandardListItem.js.map

package/dist/StandardListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StandardListItem.js","sourceRoot":"","sources":["../src/StandardListItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,UAAU,MAAM,kDAAkD,CAAC;AAC1E,OAAO,QAAQ,MAAM,eAAe,CAAC;AAErC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,YAAY,MAAM,yBAAyB,CAAC;AACnD,OAAO,wBAAwB,MAAM,uDAAuD,CAAC;AAE7F;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAUH,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,QAAQ;IAkHtC,iBAAiB;QAChB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;QACnC,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,CAAC;IAC9C,CAAC;IAED,IAAI,YAAY;QACf,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACrB,CAAC;IAED,IAAI,gBAAgB;QACnB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;IACnC,CAAC;CACD,CAAA;AA/HA;IADC,QAAQ,EAAE;qDACU;AAYrB;IADC,QAAQ,EAAE;8CACG;AAUd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACV;AAUlB;IADC,QAAQ,EAAE;+CACI;AASf;IADC,QAAQ,EAAE;wDACa;AAWxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,CAAC,IAAI,EAAE,CAAC;6DACxB;AAStC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACV;AAUV;IADP,QAAQ,EAAE;wDACoB;AAW/B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,CAAC,IAAI,EAAE,CAAC;sDACjC;AAOjC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DACD;AAY3B;IADC,IAAI,EAAE;sDAC2B;AAhH7B,gBAAgB;IATrB,aAAa,CAAC;QACd,GAAG,EAAE,QAAQ;QACb,QAAQ,EAAE,wBAAwB;QAClC,YAAY,EAAE;YACb,GAAG,QAAQ,CAAC,YAAY;YACxB,IAAI;YACJ,MAAM;SACN;KACD,CAAC;GACI,gBAAgB,CAuIrB;AAED,gBAAgB,CAAC,MAAM,EAAE,CAAC;AAE1B,eAAe,gBAAgB,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport ListItem from \"./ListItem.js\";\nimport type { IAccessibleListItem } from \"./ListItem.js\";\nimport Icon from \"./Icon.js\";\nimport Avatar from \"./Avatar.js\";\nimport WrappingType from \"./types/WrappingType.js\";\nimport StandardListItemTemplate from \"./generated/templates/StandardListItemTemplate.lit.js\";\n\n/**\n * @class\n * The `ui5-li` represents the simplest type of item for a `ui5-list`.\n *\n * This is a list item,\n * providing the most common use cases such as `text`,\n * `image` and `icon`.\n\n * @csspart title - Used to style the title of the list item\n * @csspart description - Used to style the description of the list item\n * @csspart additional-text - Used to style the additionalText of the list item\n * @csspart icon - Used to style the icon of the list item\n * @csspart native-li - Used to style the main li tag of the list item\n * @csspart content - Used to style the content area of the list item\n * @csspart detail-button - Used to style the button rendered when the list item is of type detail\n * @csspart delete-button - Used to style the button rendered when the list item is in delete mode\n * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode\n * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode\n * @slot {Node[]} default - Defines the text of the component.\n *\n * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n * @constructor\n * @extends ListItem\n * @public\n */\n@customElement({\n\ttag: \"ui5-li\",\n\ttemplate: StandardListItemTemplate,\n\tdependencies: [\n\t\t...ListItem.dependencies,\n\t\tIcon,\n\t\tAvatar,\n\t],\n})\nclass StandardListItem extends ListItem implements IAccessibleListItem {\n\t/**\n\t * Defines the description displayed right under the item text, if such is present.\n\t * @default \"\"\n\t * @public\n\t * @since 0.8.0\n\t */\n\t@property()\n\tdescription!: string;\n\n\t/**\n\t * Defines the `icon` source URI.\n\t *\n\t * **Note:**\n\t * SAP-icons font provides numerous built-in icons. To find all the available icons, see the\n\t * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\ticon!: string;\n\n\t/**\n\t * Defines whether the `icon` should be displayed in the beginning of the list item or in the end.\n\t *\n\t * **Note:** If `image` is set, the `icon` would be displayed after the `image`.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\ticonEnd!: boolean;\n\n\t/**\n\t * Defines the `image` source URI.\n\t *\n\t * **Note:** The `image` would be displayed in the beginning of the list item.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\timage!: string;\n\n\t/**\n\t * Defines the `additionalText`, displayed in the end of the list item.\n\t * @default \"\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tadditionalText!: string;\n\n\t/**\n\t * Defines the state of the `additionalText`.\n\t *\n\t * Available options are: `\"None\"` (by default), `\"Positive\"`, `\"Critical\"`, `\"Information\"` and `\"Negative\"`.\n\t * @default \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property({ type: ValueState, defaultValue: ValueState.None })\n\tadditionalTextState!: `${ValueState}`;\n\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable!: boolean;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t * Note: If not provided a default text alternative will be set, if present.\n\t * @default \"\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tdeclare accessibleName: string;\n\n\t/**\n\t * Defines if the text of the component should wrap, they truncate by default.\n\t *\n\t * **Note:** this property takes affect only if text node is provided to default slot of the component\n\t * @default \"None\"\n\t * @private\n\t * @since 1.5.0\n\t */\n\t@property({ type: WrappingType, defaultValue: WrappingType.None })\n\twrappingType!: `${WrappingType}`;\n\n\t/**\n\t * Indicates if the list item has text content.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\thasTitle!: boolean;\n\n\t@property({ type: Boolean })\n\t_hasImageContent!: boolean;\n\n\t/**\n\t * **Note:** While the slot allows option for setting custom avatar, to match the\n\t * design guidelines, please use the `ui5-avatar` with it's default size - S.\n\t *\n\t * **Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n\t * `ui5-li` should be customized in order to fit.\n\t * @since 1.10.0\n\t * @public\n\t */\n\t@slot()\n\timageContent!: Array<HTMLElement>;\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\t\tthis.hasTitle = !!this.textContent;\n\t\tthis._hasImageContent = this.hasImageContent;\n\t}\n\n\tget displayImage(): boolean {\n\t\treturn !!this.image;\n\t}\n\n\tget displayIconBegin(): boolean {\n\t\treturn !!(this.icon && !this.iconEnd);\n\t}\n\n\tget displayIconEnd(): boolean {\n\t\treturn !!(this.icon && this.iconEnd);\n\t}\n\n\tget hasImageContent(): boolean {\n\t\treturn !!this.imageContent.length;\n\t}\n}\n\nStandardListItem.define();\n\nexport default StandardListItem;\n"]}

package/dist/StepInput.d.ts

@@ -0,0 +1,238 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import { Timeout } from "@ui5/webcomponents-base/dist/types.js";
+import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js";
+import "@ui5/webcomponents-icons/dist/less.js";
+import "@ui5/webcomponents-icons/dist/add.js";
+import Input from "./Input.js";
+import InputType from "./types/InputType.js";
+type StepInputValueStateChangeEventDetail = {
+    valueState: `${ValueState}`;
+    valid: boolean;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-step-input` consists of an input field and buttons with icons to increase/decrease the value
+ * with the predefined step.
+ *
+ * The user can change the value of the component by pressing the increase/decrease buttons,
+ * by typing a number directly, by using the keyboard up/down and page up/down,
+ * or by using the mouse scroll wheel. Decimal values are supported.
+ *
+ * ### Usage
+ *
+ * The default step is 1 but the app developer can set a different one.
+ *
+ * App developers can set a maximum and minimum value for the `StepInput`.
+ * The increase/decrease button and the up/down keyboard navigation become disabled when
+ * the value reaches the max/min or a new value is entered from the input which is greater/less than the max/min.
+ *
+ * #### When to use:
+ *
+ * - To adjust amounts, quantities, or other values quickly.
+ * - To adjust values for a specific step.
+ *
+ * #### When not to use:
+ *
+ * - To enter a static number (for example, postal code, phone number, or ID). In this case,
+ * use the regular `ui5-input` instead.
+ * - To display a value that rarely needs to be adjusted and does not pertain to a particular step.
+ * In this case, use the regular `ui5-input` instead.
+ * - To enter dates and times. In this case, use date/time related components instead.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/StepInput.js";`
+ * @constructor
+ * @extends UI5Element
+ * @since 1.0.0-rc.13
+ * @public
+ */
+declare class StepInput extends UI5Element implements IFormInputElement {
+    /**
+     * Defines a value of the component.
+     * @default 0
+     * @public
+     */
+    value: number;
+    /**
+     * Defines a minimum value of the component.
+     * @default undefined
+     * @public
+     */
+    min?: number;
+    /**
+     * Defines a maximum value of the component.
+     * @default undefined
+     * @public
+     */
+    max?: number;
+    /**
+     * Defines a step of increasing/decreasing the value of the component.
+     * @default 1
+     * @public
+     */
+    step: number;
+    /**
+     * Defines the value state of the component.
+     * @default "None"
+     * @public
+     */
+    valueState: `${ValueState}`;
+    /**
+     * Defines whether the component is required.
+     * @default false
+     * @public
+     */
+    required: boolean;
+    /**
+     * Determines whether the component is displayed as disabled.
+     * @default false
+     * @public
+     */
+    disabled: boolean;
+    /**
+     * Determines whether the component is displayed as read-only.
+     * @default false
+     * @public
+     */
+    readonly: boolean;
+    /**
+     * Defines a short hint, intended to aid the user with data entry when the
+     * component has no value.
+     *
+     * **Note:** When no placeholder is set, the format pattern is displayed as a placeholder.
+     * Passing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.
+     * @default undefined
+     * @public
+     */
+    placeholder?: string;
+    /**
+     * 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
+     */
+    name: string;
+    /**
+     * Determines the number of digits after the decimal point of the component.
+     * @default 0
+     * @public
+     */
+    valuePrecision: number;
+    /**
+     * Defines the accessible ARIA name of the component.
+     * @default ""
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    accessibleName: string;
+    /**
+     * Receives id(or many ids) of the elements that label the component.
+     * @default ""
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    accessibleNameRef: string;
+    _decIconDisabled: boolean;
+    _incIconDisabled: boolean;
+    focused: boolean;
+    _inputFocused: boolean;
+    _previousValue: number;
+    _waitTimeout: number;
+    _speed: number;
+    _btnDown: boolean;
+    _spinTimeoutId: Timeout;
+    _spinStarted: boolean;
+    /**
+     * Defines the value state message that will be displayed as pop up under the component.
+     *
+     * **Note:** If not specified, a default text (in the respective language) will be displayed.
+     *
+     * **Note:** The `valueStateMessage` would be displayed,
+     * when the component is in `Information`, `Warning` or `Error` value state.
+     * @public
+     */
+    valueStateMessage: Array<HTMLElement>;
+    _initialValueState?: `${ValueState}`;
+    static i18nBundle: I18nBundle;
+    formElementAnchor(): Promise<HTMLElement | undefined>;
+    get formFormattedValue(): FormData | string | null;
+    static onDefine(): Promise<void>;
+    get type(): InputType;
+    get decIconTitle(): string;
+    get decIconName(): string;
+    get incIconTitle(): string;
+    get incIconName(): string;
+    get _decIconClickable(): boolean;
+    get _incIconClickable(): boolean;
+    get _isFocused(): boolean;
+    get _displayValue(): string;
+    get accInfo(): {
+        ariaRequired: boolean;
+        ariaLabel: string | undefined;
+    };
+    get inputAttributes(): {
+        min: number | undefined;
+        max: number | undefined;
+        step: number;
+    };
+    onBeforeRendering(): void;
+    get input(): Input;
+    get innerInput(): HTMLInputElement;
+    get inputOuter(): Element;
+    _onButtonFocusOut(): void;
+    _onInputFocusIn(): void;
+    _onInputFocusOut(): void;
+    _setButtonState(): void;
+    _validate(): void;
+    _updateValueState(): void;
+    _preciseValue(value: number): number;
+    _fireChangeEvent(): void;
+    /**
+     * Value modifier - modifies the value of the component, validates the new value and enables/disables increment and
+     * decrement buttons according to the value and min/max values (if set). Fires `change` event when requested
+     * @private
+     * @param modifier modifies the value of the component with the given modifier (positive or negative)
+     * @param fireChangeEvent if `true`, fires `change` event when the value is changed
+     */
+    _modifyValue(modifier: number, fireChangeEvent?: boolean): void;
+    _incValue(e: CustomEvent): void;
+    _decValue(e: CustomEvent): void;
+    get _isValueWithCorrectPrecision(): boolean;
+    _onInputChange(): void;
+    _setDefaultInputValueIfNeeded(): void;
+    _isValueChanged(inputValue: number): boolean;
+    _updateValueAndValidate(inputValue: number): void;
+    _onfocusin(): void;
+    _onfocusout(): void;
+    _onkeydown(e: KeyboardEvent): void;
+    _decSpin(): void;
+    _incSpin(): void;
+    /**
+     * Calculates the time which should be waited until _spinValue function is called.
+     */
+    _calcWaitTimeout(): number;
+    /**
+     * Called when the increment or decrement button is pressed and held to set new value.
+     * @private
+     * @param increment - is this the increment button or not so the values should be spin accordingly up or down
+     * @param resetVariables - whether to reset the spin-related variables or not
+     */
+    _spinValue(increment: boolean, resetVariables?: boolean): void;
+    /**
+    * Resets spin process
+    */
+    _resetSpin(): void;
+    /**
+    * Resets spin process when mouse outs + or - buttons
+    */
+    _resetSpinOut(): void;
+}
+export default StepInput;
+export type { StepInputValueStateChangeEventDetail, };