import { ReactNode } from 'react';
import { IWebApp, UserProfile } from '@edifice.io/client';
export type BadgeRef = HTMLSpanElement;
/** Badge variant : notification */
export type NotificationBadgeVariant = {
type: 'notification';
level: 'success' | 'warning' | 'danger' | 'info';
};
/** Badge variant : status */
export type StatusBadgeVariant = {
type: 'status';
level: 'validate' | 'success' | 'warning' | 'danger' | 'info';
};
/** Badge variant : content */
export type ContentBadgeVariant = {
type: 'content';
level: 'success' | 'warning' | 'danger' | 'info';
background?: boolean;
};
/** Badge variant : profile = teacher, student, relative or personnel, guest */
export type ProfileBadgeVariant = {
type: 'user';
profile: UserProfile[number];
background?: boolean;
};
/** Badge variant : chip */
export type ChipBadgeVariant = {
type: 'chip';
};
/** Badge variant : link */
export type LinkBadgeVariant = {
type: 'link';
};
/**
* Badge variant : App Version.
*
* Displays a badge showing the app version, for example: BÊTA, ALPHA, NEW or a custom version label.
*
* Default label is BÊTA unless a label is provided as a children of the component.
* Example of usage:
* NEW
*
* The color prop allows to customize the badge color to match the app color (Defaults to black if not provided).
* Example of usage:
*
*
* If app prop is provided, the color of the App Version Badge is derived from the application colors,
* for example if the app provided is Blog then the Badge will have the same color as Blog app.
* Example of usage:
*
*/
export type AppVersionBadgeVariant = {
type: 'appVersion';
color?: string;
app?: IWebApp;
};
export type BadgeVariants = NotificationBadgeVariant | StatusBadgeVariant | ContentBadgeVariant | ProfileBadgeVariant | ChipBadgeVariant | LinkBadgeVariant | AppVersionBadgeVariant;
export interface BadgeProps extends React.ComponentPropsWithRef<'span'> {
/**
* Badge variant : notification, link or profile (Teacher|Student|Relative|Personnel)
* Defaults to notification.
*/
variant?: BadgeVariants;
/**
* Text or icon (or whatever) to render as children elements.
*/
children?: ReactNode;
/**
* Optional class for styling purpose
*/
className?: string;
}
/**
* Primary UI component for user interaction
*/
declare const Badge: import('react').ForwardRefExoticComponent & import('react').RefAttributes>;
export default Badge;