@ui5/webcomponents-react
Version:
React Wrapper for UI5 Web Components and additional components
83 lines (82 loc) • 3.31 kB
TypeScript
import ValueState from '@ui5/webcomponents-base/dist/types/ValueState.js';
import type { MouseEventHandler, ReactNode } from 'react';
import type { IndicationColor } from '../../enums/IndicationColor.js';
import type { CommonProps } from '../../types/index.js';
export interface ObjectStatusPropTypes extends CommonProps {
/**
* Indicates if the ObjectStatus is rendered as inactive `div` or interactive `button` and therefore can be clicked/tapped by the user or not.
*
* **Note:** If this prop is set to `true`, you should also set the `children` or `icon` prop.
*
*
* @since 0.16.6
*/
interactive?: boolean;
/**
* Defines the icon in front of the `ObjectStatus` text.
*
* __Note:__ Although this slot accepts HTML Elements, it is strongly recommended that you only use the `Icon` component with `mode="Decorative"` in order to preserve the intended design.
*/
icon?: ReactNode;
/**
* Determines whether the background color reflects the set state instead of the text
*
* @since 0.16.6
*/
inverted?: boolean;
/**
* Defines if the component should be rendered in large design.
*
* @since 1.21.0
*/
large?: boolean;
/**
* Defines the text of the `ObjectStatus`.
*
* __Note:__ Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
*/
children?: ReactNode;
/**
* Defines the value state of the `ObjectStatus`.
*
* Since version 0.17.0 the state property also accepts values from enum `IndicationColor`.
*
* __Note:__ Only the `inverted` `ObjectStatus` supports `IndicationColor`s 11-20. For non-inverted `ObjectStatus`, these colors default to the `"None"` `state` color and should __not__ be used.
*
* @default `"None"`
*/
state?: ValueState | keyof typeof ValueState | IndicationColor | keyof typeof IndicationColor;
/**
* Defines whether the default icon for each `ValueState` should be displayed.
*
* __Note:__ If the `icon` prop was set, `showDefaultIcon` has no effect.
*/
showDefaultIcon?: boolean;
/**
* Specifies if an empty indicator should be displayed when there is no text.
*
* @since 1.19.0
*/
emptyIndicator?: boolean;
/**
* Enables overriding of the default state announcement read by screen readers.
*
* @since 1.19.0
*/
stateAnnouncementText?: string;
/**
* Fires when the user clicks/taps on an interactive text.
*
* __Note:__ This prop has no effect if `interactive` is not set to `true`.
*
* @since 0.16.6
*/
onClick?: MouseEventHandler<HTMLButtonElement>;
}
/**
* Status information that can be either text with a value state, or an icon.
*
* __Note:__ When used in interactive lists or tables, consider overriding the active state styling. Learn more [here](https://ui5.github.io/webcomponents-react/v2/?path=/docs/data-display-objectstatus--docs#objectstatus-in-interactive-lists-or-tables).
*/
declare const ObjectStatus: import("react").ForwardRefExoticComponent<ObjectStatusPropTypes & import("react").RefAttributes<HTMLDivElement | HTMLButtonElement>>;
export { ObjectStatus };