@kvaser/canking-api/dist/controls/NumberRangeControl.d.ts

CanKing API to communicate with the CanKing service using Node.js.

/**
 * This module includes a UI control for entering number ranges.
 *
 * To be able to use these controls the CanKingDataProvider component must be present in the
 * component tree above your component. Normally the CanKingDataProvider is added
 * at the root of the component tree.
 *
 * @packageDocumentation
 */
import { JSX } from 'react';
/**
 * Properties of the NumberRangeControl React component.
 */
export interface NumberRangeControlProps {
    /** The min value. */
    minValue: string;
    /** The max value. */
    maxValue: string;
    /**
     * Callback that is called on a change event.
     * @param newMinValue - The new min value.
     * @param newMaxValue - The new max value.
     */
    onChange?: (newMinValue: string, newMaxValue: string) => void;
    /**
     * Callback that is called on a blur event.
     * @param newMinValue - The new min value.
     * @param newMaxValue - The new max value.
     */
    onBlur?: (newMinValue: string, newMaxValue: string) => void;
    /** The current min error state. */
    minError?: boolean;
    /**
     * Callback that is called when the min errors state has changed.
     * @param errors - The new min errors state.
     */
    onMinErrorChange?: (errors: boolean) => void;
    /** The current max error state. */
    maxError?: boolean;
    /**
     * Callback that is called when the max errors state has changed.
     * @param errors - The new max errors state.
     */
    onMaxErrorChange?: (errors: boolean) => void;
    /**
     * Callback that will be called when the value has been changed or the control has lost focus.
     * This callback is called before onChange and if the returned err value is true then onChange
     * won't be called.
     * The implemtation of this callback is allowed to modify the specified value and return
     * the modified value in the val property of the returned object.
     * @param value - The new text value.
     * @param trigger - The trigger of this callback, either on 'change' or on 'blur'.
     * @returns An object with the validated text value (val) and an error state (err).
     */
    onMinValidate?: (value: string, trigger: 'change' | 'blur') => {
        val: string;
        err: boolean;
    };
    /**
     * Callback that will be called when the value has been changed or the control has lost focus.
     * This callback is called before onChange and if the returned err value is true then onChange
     * won't be called.
     * The implemtation of this callback is allowed to modify the specified value and return
     * the modified value in the val property of the returned object.
     * @param value - The new text value.
     * @param trigger - The trigger of this callback, either on 'change' or on 'blur'.
     * @returns An object with the validated text value (val) and an error state (err).
     */
    onMaxValidate?: (value: string, trigger: 'change' | 'blur') => {
        val: string;
        err: boolean;
    };
    /** Set to true to disable the min value field. */
    minDisabled?: boolean;
    /** Set to true to disable the max value field. */
    maxDisabled?: boolean;
    /** A unit text that will be displayed next to the values. */
    unit?: string;
    /** Lower value limit. */
    lowerLimit?: number;
    /** Upper value limit. */
    upperLimit?: number;
}
/**
 * Creates a number range control.
 * @param props - Component properties.
 * @returns The NumberRangeControl React component.
 */
declare function NumberRangeControl({ minValue, maxValue, onChange, onBlur, minError, onMinErrorChange, maxError, onMaxErrorChange, onMinValidate, onMaxValidate, minDisabled, maxDisabled, unit, lowerLimit, upperLimit, }: NumberRangeControlProps): JSX.Element;
export default NumberRangeControl;