@ui5/webcomponents-react/dist/webComponents/StepInput/index.js

React Wrapper for UI5 Web Components and additional components

'use client';

import '@ui5/webcomponents/dist/StepInput.js';
import { withWebComponent } from '../../internal/withWebComponent.js';
/**
 * The `StepInput` 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 `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 `Input` instead.
 * - To enter dates and times. In this case, use date/time related components instead.
 *
 *
 *
 * __Note__: This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)
 */
const StepInput = withWebComponent('ui5-step-input', ['accessibleName', 'accessibleNameRef', 'max', 'min', 'name', 'placeholder', 'step', 'value', 'valuePrecision', 'valueState'], ['disabled', 'readonly', 'required'], ['valueStateMessage'], ['change', 'value-state-change']);
StepInput.displayName = 'StepInput';
export { StepInput };