azure-devops-ui
Version:
React components for building web UI in Azure DevOps
72 lines (71 loc) • 2.46 kB
TypeScript
import * as React from "react";
import { IReadonlyObservableValue } from '../../Core/Observable';
export interface IFormItemContext {
/**
* The id to use as the consuming component's ariaDescribedBy
*/
ariaDescribedById?: string;
/**
* The id to use as the consuming component's ariaLabelledBy
*/
ariaLabelledById?: string;
/**
* Whether or not the FormItem is in an error state. Consuming components
* can alter their visualization based on this prop.
*
* @default false
*/
error?: boolean;
/**
* Differentiates between error and warning states of FormItem. Consuming components
* can alter their visualization based on this prop.
*
* @default Severity.Error
*/
severity?: Severity;
}
export interface IFormItemProps {
/**
* Optional aria label that can be supplied if is should be something different than label.
*/
ariaLabel?: string;
/**
* Optional className to include on the element that wraps the item's
*/
className?: string;
/**
* Whether or not the form item is currently in an error state.
*/
error?: IReadonlyObservableValue<boolean> | boolean;
/**
* Differentiates between error and warning states of FormItem.
*/
severity?: IReadonlyObservableValue<Severity> | Severity;
/**
* A label for the component. Will be wrapped in a <label /> element.
*/
label?: React.ReactNode;
/**
* A helper message to include with the component. Will be wrapped in a <span /> element.
*/
message?: IReadonlyObservableValue<React.ReactNode> | React.ReactNode;
/**
* Set to mark the form item as required.
*/
required?: boolean;
/**
* Emit generated label ID.
* This can be used by consuming components to associate the label with the input,
* which is often needed due to accessibility reasons.
* For example, we might want narrators to announce the input value together with the label so that users know what the value represents.
* This event is needed because Label ID can't be determined in advance (it depends on number of available instances).
*/
emitGeneratedLabelId?: (labelId: string) => void;
}
/**
* Differentiates between error and warning states.
*/
export declare enum Severity {
Error = 1,
Warning = 2
}