@manta-eu/react/banner

Reference for @manta-eu/react/banner as it is on main.

Type Aliases

BannerBaseProps

BannerBaseProps = object

Properties

className?

optional className?: string

label

label: string

onClose?

optional onClose?: () => void

Returns

void

ref?

optional ref?: Ref<HTMLDivElement>

testId?

optional testId?: string

BannerProps

BannerProps = VariantPropsOf<typeof bannerConfig> & (CompactBannerProps | LooseBannerProps)

CompactBannerProps

CompactBannerProps = BannerBaseProps & object

Type Declaration

actionLabel?

optional actionLabel?: never

children?

optional children?: never

description?

optional description?: never

icon?

optional icon?: never

linkHref?

optional linkHref?: string

linkText?

optional linkText?: string

onAction?

optional onAction?: never

size?

optional size?: "compact"

LooseBannerProps

LooseBannerProps = BannerBaseProps & object

Type Declaration

actionHref?

optional actionHref?: string

actionIcon?

optional actionIcon?: ComponentType<{ className?: string; }>

actionLabel?

optional actionLabel?: string

buttonTestId?

optional buttonTestId?: string

children?

optional children?: ReactNode

description?

optional description?: string | ReactNode

icon?

optional icon?: ComponentType<{ className?: string; }>

linkHref?

optional linkHref?: never

linkText?

optional linkText?: never

onAction?

optional onAction?: () => void

Returns

void

size

size: "loose"

Variables

bannerConfig

const bannerConfig: object

Type Declaration

defaultVariants

defaultVariants: object

defaultVariants.size

readonly size: "compact" = "compact"

defaultVariants.type

readonly type: "error" = "error"

slots

slots: object

slots.base

base: string = "relative flex items-center overflow-hidden rounded-md-v4"

slots.closeButton

closeButton: string = "shrink-0 opacity-50 hover:opacity-100 transition-opacity cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-active-border/50 rounded-sm"

slots.closeIcon

closeIcon: string = "size-4 text-default-foreground"

slots.content

content: string = "flex items-center"

slots.description

description: string = "typography-caption-medium opacity-70"

slots.icon

icon: string = "size-5"

slots.iconWrapper

iconWrapper: string = "shrink-0"

slots.label

label: string = "typography-caption-medium"

slots.link

link: string = "typography-caption-medium underline underline-offset-2 decoration-current"

variants

variants: object

variants.size

size: object

variants.size.compact

compact: object

variants.size.compact.base

base: string = "px-3 py-2.5 justify-center gap-2.5"

variants.size.compact.closeButton

closeButton: string = "absolute right-3 top-3"

variants.size.compact.content

content: string = "gap-1.5"

variants.size.loose

loose: object

variants.size.loose.base

base: string = "px-5 py-2.5 justify-between gap-5"

variants.size.loose.closeButton

closeButton: string = "size-5"

variants.size.loose.content

content: string = "gap-5"

variants.type

type: object

variants.type.error

error: object

variants.type.error.base

base: string = "bg-error"

variants.type.error.description

description: string = "text-error-foreground"

variants.type.error.icon

icon: string = "text-error-foreground"

variants.type.error.label

label: string = "text-error-foreground"

variants.type.error.link

link: string = "text-error-foreground"

variants.type.info

info: object

variants.type.info.base

base: string = "bg-info"

variants.type.info.description

description: string = "text-info-foreground"

variants.type.info.icon

icon: string = "text-info-foreground"

variants.type.info.label

label: string = "text-info-foreground"

variants.type.info.link

link: string = "text-info-foreground"

variants.type.muted

muted: object

variants.type.muted.base

base: string = "bg-muted"

variants.type.muted.description

description: string = "text-default-foreground"

variants.type.muted.icon

icon: string = "text-default-foreground"

variants.type.muted.label

label: string = "text-default-foreground"

variants.type.muted.link

link: string = "text-default-foreground"

variants.type.success

success: object

variants.type.success.base

base: string = "bg-success"

variants.type.success.description

description: string = "text-success-foreground"

variants.type.success.icon

icon: string = "text-success-foreground"

variants.type.success.label

label: string = "text-success-foreground"

variants.type.success.link

link: string = "text-success-foreground"

variants.type.warning

warning: object

variants.type.warning.base

base: string = "bg-warning"

variants.type.warning.description

description: string = "text-warning-foreground"

variants.type.warning.icon

icon: string = "text-warning-foreground"

variants.type.warning.label

label: string = "text-warning-foreground"

variants.type.warning.link

link: string = "text-warning-foreground"

Functions

Banner(props): Element

Parameters

props

BannerProps

Returns

Element