@ui5/webcomponents-react
Version:
React Wrapper for UI5 Web Components and additional components
48 lines (47 loc) • 1.65 kB
TypeScript
import '@ui5/webcomponents-fiori/dist/illustrations/UnableToLoad.js';
import type { VariantManagementPropTypes } from './types.js';
/**
* The VariantManagement can be used to manage variants (views). You can use this component to create and maintain personalization changes.
*
* __Note:__ On the user interface, variants are generally referred to as "views".
*
* __Note:__ Each `VariantManagement` component can only have one default and one selected variant.
*
* __Note:__ You have to install `@ui5/webcomponents-fiori` to use this component.
*
* ### Matching header styles
*
* To ensure consistent header styles for different use-cases of the `VariantManagement`, we recommend setting the following styles to the `ui5-title` component:
*
* #### DynamicPage & ObjectPage
*
* - `font-family: var(--sapObjectHeader_Title_FontFamily);`
*
* __Header expanded__
*
* - `font-size: var(--sapObjectHeader_Title_FontSize);`
*
* __Header collapsed/snapped__
*
* - `font-size: var(--sapObjectHeader_Title_SnappedFontSize);`
*
* #### Tables
*
* - `font-size: var(--sapGroup_Title_FontSize);`
*
* #### Example
*
* ```css
* .variantManagement [data-component-name="VariantManagementTitle"] {
* font-family: var(--sapObjectHeader_Title_FontFamily);
* font-size: var(--sapObjectHeader_Title_FontSize);
* }
* ```
* ```jsx
* <VariantManagement className="variantManagement">
* ```
*
*/
declare const VariantManagement: import("react").ForwardRefExoticComponent<VariantManagementPropTypes & import("react").RefAttributes<HTMLDivElement>>;
export { VariantManagement };
export type { VariantManagementPropTypes };