Skip to main content

ToastNotifications

Interfaces

ToastNotificationsProps

Extends

  • BoxProps

Indexable

[p: string]: any

Properties

PropertyTypeDescriptionInherited from
alignContentResponsiveStyleValue<string[] | AlignContent> | (theme) => ResponsiveStyleValue<string[] | AlignContent>-BoxProps.alignContent
alignItemsResponsiveStyleValue<string[] | AlignItems> | (theme) => ResponsiveStyleValue<string[] | AlignItems>-BoxProps.alignItems
alignSelfResponsiveStyleValue<string[] | AlignSelf> | (theme) => ResponsiveStyleValue<string[] | AlignSelf>-BoxProps.alignSelf
bgcolorResponsiveStyleValue<string[] | BackgroundColor> | (theme) => ResponsiveStyleValue<string[] | BackgroundColor>-BoxProps.bgcolor
borderResponsiveStyleValue<number | "none" | "hidden" | string & object | "inset" | "medium" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "aliceblue" | "antiquewhite" | "aqua" | "aquamarine" | "azure" | "beige" | "bisque" | "black" | "blanchedalmond" | "blue" | "blueviolet" | "brown" | "burlywood" | "cadetblue" | "chartreuse" | "chocolate" | "coral" | "cornflowerblue" | "cornsilk" | "crimson" | "cyan" | "darkblue" | "darkcyan" | "darkgoldenrod" | "darkgray" | "darkgreen" | "darkgrey" | "darkkhaki" | "darkmagenta" | "darkolivegreen" | "darkorange" | "darkorchid" | "darkred" | "darksalmon" | "darkseagreen" | "darkslateblue" | "darkslategray" | "darkslategrey" | "darkturquoise" | "darkviolet" | "deeppink" | "deepskyblue" | "dimgray" | "dimgrey" | "dodgerblue" | "firebrick" | "floralwhite" | "forestgreen" | "fuchsia" | "gainsboro" | "ghostwhite" | "gold" | "goldenrod" | "gray" | "green" | "greenyellow" | "grey" | "honeydew" | "hotpink" | "indianred" | "indigo" | "ivory" | "khaki" | "lavender" | "lavenderblush" | "lawngreen" | "lemonchiffon" | "lightblue" | "lightcoral" | "lightcyan" | "lightgoldenrodyellow" | "lightgray" | "lightgreen" | "lightgrey" | "lightpink" | "lightsalmon" | "lightseagreen" | "lightskyblue" | "lightslategray" | "lightslategrey" | "lightsteelblue" | "lightyellow" | "lime" | "limegreen" | "linen" | "magenta" | "maroon" | "mediumaquamarine" | "mediumblue" | "mediumorchid" | "mediumpurple" | "mediumseagreen" | "mediumslateblue" | "mediumspringgreen" | "mediumturquoise" | "mediumvioletred" | "midnightblue" | "mintcream" | "mistyrose" | "moccasin" | "navajowhite" | "navy" | "oldlace" | "olive" | "olivedrab" | "orange" | "orangered" | "orchid" | "palegoldenrod" | "palegreen" | "paleturquoise" | "palevioletred" | "papayawhip" | "peachpuff" | "peru" | "pink" | "plum" | "powderblue" | "purple" | "rebeccapurple" | "red" | "rosybrown" | "royalblue" | "saddlebrown" | "salmon" | "sandybrown" | "seagreen" | "seashell" | "sienna" | "silver" | "skyblue" | "slateblue" | "slategray" | "slategrey" | "snow" | "springgreen" | "steelblue" | "tan" | "teal" | "thistle" | "tomato" | "transparent" | "turquoise" | "violet" | "wheat" | "white" | "whitesmoke" | "yellow" | "yellowgreen" | "ActiveBorder" | "ActiveCaption" | "AppWorkspace" | "Background" | "ButtonFace" | "ButtonHighlight" | "ButtonShadow" | "ButtonText" | "CaptionText" | "GrayText" | "Highlight" | "HighlightText" | "InactiveBorder" | "InactiveCaption" | "InactiveCaptionText" | "InfoBackground" | "InfoText" | "Menu" | "MenuText" | "Scrollbar" | "ThreeDDarkShadow" | "ThreeDFace" | "ThreeDHighlight" | "ThreeDLightShadow" | "ThreeDShadow" | "Window" | "WindowFrame" | "WindowText" | "currentcolor" | "dashed" | "dotted" | "double" | "groove" | "outset" | "ridge" | "solid" | "thick" | "thin"> | (theme) => ResponsiveStyleValue<number | "none" | "hidden" | string & object | "inset" | "medium" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "aliceblue" | "antiquewhite" | "aqua" | "aquamarine" | "azure" | "beige" | "bisque" | "black" | "blanchedalmond" | "blue" | "blueviolet" | "brown" | "burlywood" | "cadetblue" | "chartreuse" | "chocolate" | "coral" | "cornflowerblue" | "cornsilk" | "crimson" | "cyan" | "darkblue" | "darkcyan" | "darkgoldenrod" | "darkgray" | "darkgreen" | "darkgrey" | "darkkhaki" | "darkmagenta" | "darkolivegreen" | "darkorange" | "darkorchid" | "darkred" | "darksalmon" | "darkseagreen" | "darkslateblue" | "darkslategray" | "darkslategrey" | "darkturquoise" | "darkviolet" | "deeppink" | "deepskyblue" | "dimgray" | "dimgrey" | "dodgerblue" | "firebrick" | "floralwhite" | "forestgreen" | "fuchsia" | "gainsboro" | "ghostwhite" | "gold" | "goldenrod" | "gray" | "green" | "greenyellow" | "grey" | "honeydew" | "hotpink" | "indianred" | "indigo" | "ivory" | "khaki" | "lavender" | "lavenderblush" | "lawngreen" | "lemonchiffon" | "lightblue" | "lightcoral" | "lightcyan" | "lightgoldenrodyellow" | "lightgray" | "lightgreen" | "lightgrey" | "lightpink" | "lightsalmon" | "lightseagreen" | "lightskyblue" | "lightslategray" | "lightslategrey" | "lightsteelblue" | "lightyellow" | "lime" | "limegreen" | "linen" | "magenta" | "maroon" | "mediumaquamarine" | "mediumblue" | "mediumorchid" | "mediumpurple" | "mediumseagreen" | "mediumslateblue" | "mediumspringgreen" | "mediumturquoise" | "mediumvioletred" | "midnightblue" | "mintcream" | "mistyrose" | "moccasin" | "navajowhite" | "navy" | "oldlace" | "olive" | "olivedrab" | "orange" | "orangered" | "orchid" | "palegoldenrod" | "palegreen" | "paleturquoise" | "palevioletred" | "papayawhip" | "peachpuff" | "peru" | "pink" | "plum" | "powderblue" | "purple" | "rebeccapurple" | "red" | "rosybrown" | "royalblue" | "saddlebrown" | "salmon" | "sandybrown" | "seagreen" | "seashell" | "sienna" | "silver" | "skyblue" | "slateblue" | "slategray" | "slategrey" | "snow" | "springgreen" | "steelblue" | "tan" | "teal" | "thistle" | "tomato" | "transparent" | "turquoise" | "violet" | "wheat" | "white" | "whitesmoke" | "yellow" | "yellowgreen" | "ActiveBorder" | "ActiveCaption" | "AppWorkspace" | "Background" | "ButtonFace" | "ButtonHighlight" | "ButtonShadow" | "ButtonText" | "CaptionText" | "GrayText" | "Highlight" | "HighlightText" | "InactiveBorder" | "InactiveCaption" | "InactiveCaptionText" | "InfoBackground" | "InfoText" | "Menu" | "MenuText" | "Scrollbar" | "ThreeDDarkShadow" | "ThreeDFace" | "ThreeDHighlight" | "ThreeDLightShadow" | "ThreeDShadow" | "Window" | "WindowFrame" | "WindowText" | "currentcolor" | "dashed" | "dotted" | "double" | "groove" | "outset" | "ridge" | "solid" | "thick" | "thin">-BoxProps.border
borderBottomResponsiveStyleValue<BorderBottom<string | number> | NonNullable<BorderBottom<string | number>>[]> | (theme) => ResponsiveStyleValue<BorderBottom<string | number> | NonNullable<BorderBottom<string | number>>[]>-BoxProps.borderBottom
borderColorResponsiveStyleValue<string[] | BorderColor> | (theme) => ResponsiveStyleValue<string[] | BorderColor>-BoxProps.borderColor
borderLeftResponsiveStyleValue<BorderLeft<string | number> | NonNullable<BorderLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<BorderLeft<string | number> | NonNullable<BorderLeft<string | number>>[]>-BoxProps.borderLeft
borderRadiusResponsiveStyleValue<BorderRadius<string | number> | NonNullable<BorderRadius<string | number>>[]> | (theme) => ResponsiveStyleValue<BorderRadius<string | number> | NonNullable<BorderRadius<string | number>>[]>-BoxProps.borderRadius
borderRightResponsiveStyleValue<BorderRight<string | number> | NonNullable<BorderRight<string | number>>[]> | (theme) => ResponsiveStyleValue<BorderRight<string | number> | NonNullable<BorderRight<string | number>>[]>-BoxProps.borderRight
borderTopResponsiveStyleValue<BorderTop<string | number> | NonNullable<BorderTop<string | number>>[]> | (theme) => ResponsiveStyleValue<BorderTop<string | number> | NonNullable<BorderTop<string | number>>[]>-BoxProps.borderTop
bottomResponsiveStyleValue<Bottom<string | number> | NonNullable<Bottom<string | number>>[]> | (theme) => ResponsiveStyleValue<Bottom<string | number> | NonNullable<Bottom<string | number>>[]>-BoxProps.bottom
boxShadowResponsiveStyleValue<number | BoxShadow> | (theme) => ResponsiveStyleValue<number | BoxShadow>-BoxProps.boxShadow
boxSizingResponsiveStyleValue<BoxSizing | NonNullable<BoxSizing>[]> | (theme) => ResponsiveStyleValue<BoxSizing | NonNullable<BoxSizing>[]>-BoxProps.boxSizing
colorResponsiveStyleValue<string[] | Color> | (theme) => ResponsiveStyleValue<string[] | Color>-BoxProps.color
columnGapResponsiveStyleValue<ColumnGap<string | number> | NonNullable<ColumnGap<string | number>>[]> | (theme) => ResponsiveStyleValue<ColumnGap<string | number> | NonNullable<ColumnGap<string | number>>[]>-BoxProps.columnGap
disableToastNotification?booleanDisable Toast Notification-
displayResponsiveStyleValue<string[] | Display> | (theme) => ResponsiveStyleValue<string[] | Display>-BoxProps.display
displayPrintResponsiveStyleValue<string[] | Display> | (theme) => ResponsiveStyleValue<string[] | Display>-BoxProps.displayPrint
flexResponsiveStyleValue<Flex<string | number> | NonNullable<Flex<string | number>>[]> | (theme) => ResponsiveStyleValue<Flex<string | number> | NonNullable<Flex<string | number>>[]>-BoxProps.flex
flexBasisResponsiveStyleValue<FlexBasis<string | number> | NonNullable<FlexBasis<string | number>>[]> | (theme) => ResponsiveStyleValue<FlexBasis<string | number> | NonNullable<FlexBasis<string | number>>[]>-BoxProps.flexBasis
flexDirectionResponsiveStyleValue<FlexDirection | NonNullable<FlexDirection>[]> | (theme) => ResponsiveStyleValue<FlexDirection | NonNullable<FlexDirection>[]>-BoxProps.flexDirection
flexGrowResponsiveStyleValue<FlexGrow | NonNullable<FlexGrow>[]> | (theme) => ResponsiveStyleValue<FlexGrow | NonNullable<FlexGrow>[]>-BoxProps.flexGrow
flexShrinkResponsiveStyleValue<FlexShrink | NonNullable<FlexShrink>[]> | (theme) => ResponsiveStyleValue<FlexShrink | NonNullable<FlexShrink>[]>-BoxProps.flexShrink
flexWrapResponsiveStyleValue<FlexWrap | NonNullable<FlexWrap>[]> | (theme) => ResponsiveStyleValue<FlexWrap | NonNullable<FlexWrap>[]>-BoxProps.flexWrap
fontFamilyResponsiveStyleValue<string[] | FontFamily> | (theme) => ResponsiveStyleValue<string[] | FontFamily>-BoxProps.fontFamily
fontSizeResponsiveStyleValue<FontSize<string | number> | NonNullable<FontSize<string | number>>[]> | (theme) => ResponsiveStyleValue<FontSize<string | number> | NonNullable<FontSize<string | number>>[]>-BoxProps.fontSize
fontStyleResponsiveStyleValue<string[] | FontStyle> | (theme) => ResponsiveStyleValue<string[] | FontStyle>-BoxProps.fontStyle
fontWeightResponsiveStyleValue<string | string & object | number & object> | (theme) => ResponsiveStyleValue<string | string & object | number & object>-BoxProps.fontWeight
gapResponsiveStyleValue<Gap<string | number> | NonNullable<Gap<string | number>>[]> | (theme) => ResponsiveStyleValue<Gap<string | number> | NonNullable<Gap<string | number>>[]>-BoxProps.gap
gridAreaResponsiveStyleValue<GridArea | NonNullable<GridArea>[]> | (theme) => ResponsiveStyleValue<GridArea | NonNullable<GridArea>[]>-BoxProps.gridArea
gridAutoColumnsResponsiveStyleValue<GridAutoColumns<string | number> | NonNullable<GridAutoColumns<string | number>>[]> | (theme) => ResponsiveStyleValue<GridAutoColumns<string | number> | NonNullable<GridAutoColumns<string | number>>[]>-BoxProps.gridAutoColumns
gridAutoFlowResponsiveStyleValue<string[] | GridAutoFlow> | (theme) => ResponsiveStyleValue<string[] | GridAutoFlow>-BoxProps.gridAutoFlow
gridAutoRowsResponsiveStyleValue<GridAutoRows<string | number> | NonNullable<GridAutoRows<string | number>>[]> | (theme) => ResponsiveStyleValue<GridAutoRows<string | number> | NonNullable<GridAutoRows<string | number>>[]>-BoxProps.gridAutoRows
gridColumnResponsiveStyleValue<GridColumn | NonNullable<GridColumn>[]> | (theme) => ResponsiveStyleValue<GridColumn | NonNullable<GridColumn>[]>-BoxProps.gridColumn
gridRowResponsiveStyleValue<GridRow | NonNullable<GridRow>[]> | (theme) => ResponsiveStyleValue<GridRow | NonNullable<GridRow>[]>-BoxProps.gridRow
gridTemplateAreasResponsiveStyleValue<string[] | GridTemplateAreas> | (theme) => ResponsiveStyleValue<string[] | GridTemplateAreas>-BoxProps.gridTemplateAreas
gridTemplateColumnsResponsiveStyleValue<GridTemplateColumns<string | number> | NonNullable<GridTemplateColumns<string | number>>[]> | (theme) => ResponsiveStyleValue<GridTemplateColumns<string | number> | NonNullable<GridTemplateColumns<string | number>>[]>-BoxProps.gridTemplateColumns
gridTemplateRowsResponsiveStyleValue<GridTemplateRows<string | number> | NonNullable<GridTemplateRows<string | number>>[]> | (theme) => ResponsiveStyleValue<GridTemplateRows<string | number> | NonNullable<GridTemplateRows<string | number>>[]>-BoxProps.gridTemplateRows
handleNotification?(type: any, data: any, content: any) => ElementHandle notification-
heightResponsiveStyleValue<Height<string | number> | NonNullable<Height<string | number>>[]> | (theme) => ResponsiveStyleValue<Height<string | number> | NonNullable<Height<string | number>>[]>-BoxProps.height
justifyContentResponsiveStyleValue<string[] | JustifyContent> | (theme) => ResponsiveStyleValue<string[] | JustifyContent>-BoxProps.justifyContent
justifyItemsResponsiveStyleValue<string[] | JustifyItems> | (theme) => ResponsiveStyleValue<string[] | JustifyItems>-BoxProps.justifyItems
justifySelfResponsiveStyleValue<string[] | JustifySelf> | (theme) => ResponsiveStyleValue<string[] | JustifySelf>-BoxProps.justifySelf
leftResponsiveStyleValue<Left<string | number> | NonNullable<Left<string | number>>[]> | (theme) => ResponsiveStyleValue<Left<string | number> | NonNullable<Left<string | number>>[]>-BoxProps.left
letterSpacingResponsiveStyleValue<LetterSpacing<string | number> | NonNullable<LetterSpacing<string | number>>[]> | (theme) => ResponsiveStyleValue<LetterSpacing<string | number> | NonNullable<LetterSpacing<string | number>>[]>-BoxProps.letterSpacing
lineHeightResponsiveStyleValue<LineHeight<string | number> | NonNullable<LineHeight<string | number>>[]> | (theme) => ResponsiveStyleValue<LineHeight<string | number> | NonNullable<LineHeight<string | number>>[]>-BoxProps.lineHeight
mResponsiveStyleValue<Margin<string | number> | NonNullable<Margin<string | number>>[]> | (theme) => ResponsiveStyleValue<Margin<string | number> | NonNullable<Margin<string | number>>[]>-BoxProps.m
marginResponsiveStyleValue<Margin<string | number> | NonNullable<Margin<string | number>>[]> | (theme) => ResponsiveStyleValue<Margin<string | number> | NonNullable<Margin<string | number>>[]>-BoxProps.margin
marginBlockResponsiveStyleValue<MarginBlock<string | number> | NonNullable<MarginBlock<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginBlock<string | number> | NonNullable<MarginBlock<string | number>>[]>-BoxProps.marginBlock
marginBlockEndResponsiveStyleValue<MarginBlockEnd<string | number> | NonNullable<MarginBlockEnd<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginBlockEnd<string | number> | NonNullable<MarginBlockEnd<string | number>>[]>-BoxProps.marginBlockEnd
marginBlockStartResponsiveStyleValue<MarginBlockStart<string | number> | NonNullable<MarginBlockStart<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginBlockStart<string | number> | NonNullable<MarginBlockStart<string | number>>[]>-BoxProps.marginBlockStart
marginBottomResponsiveStyleValue<MarginBottom<string | number> | NonNullable<MarginBottom<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginBottom<string | number> | NonNullable<MarginBottom<string | number>>[]>-BoxProps.marginBottom
marginInlineResponsiveStyleValue<MarginInline<string | number> | NonNullable<MarginInline<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginInline<string | number> | NonNullable<MarginInline<string | number>>[]>-BoxProps.marginInline
marginInlineEndResponsiveStyleValue<MarginInlineEnd<string | number> | NonNullable<MarginInlineEnd<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginInlineEnd<string | number> | NonNullable<MarginInlineEnd<string | number>>[]>-BoxProps.marginInlineEnd
marginInlineStartResponsiveStyleValue<MarginInlineStart<string | number> | NonNullable<MarginInlineStart<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginInlineStart<string | number> | NonNullable<MarginInlineStart<string | number>>[]>-BoxProps.marginInlineStart
marginLeftResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]>-BoxProps.marginLeft
marginRightResponsiveStyleValue<MarginRight<string | number> | NonNullable<MarginRight<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginRight<string | number> | NonNullable<MarginRight<string | number>>[]>-BoxProps.marginRight
marginTopResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]>-BoxProps.marginTop
marginXResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]>-BoxProps.marginX
marginYResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]>-BoxProps.marginY
maxHeightResponsiveStyleValue<MaxHeight<string | number> | NonNullable<MaxHeight<string | number>>[]> | (theme) => ResponsiveStyleValue<MaxHeight<string | number> | NonNullable<MaxHeight<string | number>>[]>-BoxProps.maxHeight
maxWidthResponsiveStyleValue<MaxWidth<string | number> | NonNullable<MaxWidth<string | number>>[]> | (theme) => ResponsiveStyleValue<MaxWidth<string | number> | NonNullable<MaxWidth<string | number>>[]>-BoxProps.maxWidth
mbResponsiveStyleValue<MarginBottom<string | number> | NonNullable<MarginBottom<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginBottom<string | number> | NonNullable<MarginBottom<string | number>>[]>-BoxProps.mb
minHeightResponsiveStyleValue<MinHeight<string | number> | NonNullable<MinHeight<string | number>>[]> | (theme) => ResponsiveStyleValue<MinHeight<string | number> | NonNullable<MinHeight<string | number>>[]>-BoxProps.minHeight
minWidthResponsiveStyleValue<MinWidth<string | number> | NonNullable<MinWidth<string | number>>[]> | (theme) => ResponsiveStyleValue<MinWidth<string | number> | NonNullable<MinWidth<string | number>>[]>-BoxProps.minWidth
mlResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]>-BoxProps.ml
mrResponsiveStyleValue<MarginRight<string | number> | NonNullable<MarginRight<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginRight<string | number> | NonNullable<MarginRight<string | number>>[]>-BoxProps.mr
mtResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]>-BoxProps.mt
mxResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginLeft<string | number> | NonNullable<MarginLeft<string | number>>[]>-BoxProps.mx
myResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]> | (theme) => ResponsiveStyleValue<MarginTop<string | number> | NonNullable<MarginTop<string | number>>[]>-BoxProps.my
orderResponsiveStyleValue<Order | NonNullable<Order>[]> | (theme) => ResponsiveStyleValue<Order | NonNullable<Order>[]>-BoxProps.order
overflowResponsiveStyleValue<string[] | Overflow> | (theme) => ResponsiveStyleValue<string[] | Overflow>-BoxProps.overflow
pResponsiveStyleValue<Padding<string | number> | NonNullable<Padding<string | number>>[]> | (theme) => ResponsiveStyleValue<Padding<string | number> | NonNullable<Padding<string | number>>[]>-BoxProps.p
paddingResponsiveStyleValue<Padding<string | number> | NonNullable<Padding<string | number>>[]> | (theme) => ResponsiveStyleValue<Padding<string | number> | NonNullable<Padding<string | number>>[]>-BoxProps.padding
paddingBlockResponsiveStyleValue<PaddingBlock<string | number> | NonNullable<PaddingBlock<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingBlock<string | number> | NonNullable<PaddingBlock<string | number>>[]>-BoxProps.paddingBlock
paddingBlockEndResponsiveStyleValue<PaddingBlockEnd<string | number> | NonNullable<PaddingBlockEnd<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingBlockEnd<string | number> | NonNullable<PaddingBlockEnd<string | number>>[]>-BoxProps.paddingBlockEnd
paddingBlockStartResponsiveStyleValue<PaddingBlockStart<string | number> | NonNullable<PaddingBlockStart<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingBlockStart<string | number> | NonNullable<PaddingBlockStart<string | number>>[]>-BoxProps.paddingBlockStart
paddingBottomResponsiveStyleValue<PaddingBottom<string | number> | NonNullable<PaddingBottom<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingBottom<string | number> | NonNullable<PaddingBottom<string | number>>[]>-BoxProps.paddingBottom
paddingInlineResponsiveStyleValue<PaddingInline<string | number> | NonNullable<PaddingInline<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingInline<string | number> | NonNullable<PaddingInline<string | number>>[]>-BoxProps.paddingInline
paddingInlineEndResponsiveStyleValue<PaddingInlineEnd<string | number> | NonNullable<PaddingInlineEnd<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingInlineEnd<string | number> | NonNullable<PaddingInlineEnd<string | number>>[]>-BoxProps.paddingInlineEnd
paddingInlineStartResponsiveStyleValue<PaddingInlineStart<string | number> | NonNullable<PaddingInlineStart<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingInlineStart<string | number> | NonNullable<PaddingInlineStart<string | number>>[]>-BoxProps.paddingInlineStart
paddingLeftResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]>-BoxProps.paddingLeft
paddingRightResponsiveStyleValue<PaddingRight<string | number> | NonNullable<PaddingRight<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingRight<string | number> | NonNullable<PaddingRight<string | number>>[]>-BoxProps.paddingRight
paddingTopResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]>-BoxProps.paddingTop
paddingXResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]>-BoxProps.paddingX
paddingYResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]>-BoxProps.paddingY
pbResponsiveStyleValue<PaddingBottom<string | number> | NonNullable<PaddingBottom<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingBottom<string | number> | NonNullable<PaddingBottom<string | number>>[]>-BoxProps.pb
plResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]>-BoxProps.pl
positionResponsiveStyleValue<Position | NonNullable<Position>[]> | (theme) => ResponsiveStyleValue<Position | NonNullable<Position>[]>-BoxProps.position
prResponsiveStyleValue<PaddingRight<string | number> | NonNullable<PaddingRight<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingRight<string | number> | NonNullable<PaddingRight<string | number>>[]>-BoxProps.pr
ptResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]>-BoxProps.pt
pxResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | NonNullable<PaddingLeft<string | number>>[]>-BoxProps.px
pyResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]> | (theme) => ResponsiveStyleValue<PaddingTop<string | number> | NonNullable<PaddingTop<string | number>>[]>-BoxProps.py
rightResponsiveStyleValue<Right<string | number> | NonNullable<Right<string | number>>[]> | (theme) => ResponsiveStyleValue<Right<string | number> | NonNullable<Right<string | number>>[]>-BoxProps.right
rowGapResponsiveStyleValue<RowGap<string | number> | NonNullable<RowGap<string | number>>[]> | (theme) => ResponsiveStyleValue<RowGap<string | number> | NonNullable<RowGap<string | number>>[]>-BoxProps.rowGap
textAlignResponsiveStyleValue<TextAlign | NonNullable<TextAlign>[]> | (theme) => ResponsiveStyleValue<TextAlign | NonNullable<TextAlign>[]>-BoxProps.textAlign
textOverflowResponsiveStyleValue<string[] | TextOverflow> | (theme) => ResponsiveStyleValue<string[] | TextOverflow>-BoxProps.textOverflow
textTransformResponsiveStyleValue<TextTransform | NonNullable<TextTransform>[]> | (theme) => ResponsiveStyleValue<TextTransform | NonNullable<TextTransform>[]>-BoxProps.textTransform
topResponsiveStyleValue<Top<string | number> | NonNullable<Top<string | number>>[]> | (theme) => ResponsiveStyleValue<Top<string | number> | NonNullable<Top<string | number>>[]>-BoxProps.top
typographyResponsiveStyleValue<string> | (theme) => ResponsiveStyleValue<string>-BoxProps.typography
visibilityResponsiveStyleValue<Visibility | NonNullable<Visibility>[]> | (theme) => ResponsiveStyleValue<Visibility | NonNullable<Visibility>[]>-BoxProps.visibility
whiteSpaceResponsiveStyleValue<WhiteSpace | NonNullable<WhiteSpace>[]> | (theme) => ResponsiveStyleValue<WhiteSpace | NonNullable<WhiteSpace>[]>-BoxProps.whiteSpace
widthResponsiveStyleValue<Width<string | number> | NonNullable<Width<string | number>>[]> | (theme) => ResponsiveStyleValue<Width<string | number> | NonNullable<Width<string | number>>[]>-BoxProps.width
zIndexResponsiveStyleValue<string | string & object | number & object> | (theme) => ResponsiveStyleValue<string | string & object | number & object>-BoxProps.zIndex

Functions

ToastNotificationsSkeleton()

ToastNotificationsSkeleton(): JSX.Element

API documentation for the Community-JS Toast Notifications Skeleton component. Learn about the available props and the CSS API.

Import

import {ToastNotificationsSkeleton} from '@selfcommunity/react-ui';

Component Name

The name SCToastNotifications-skeleton-root can be used when providing style overrides in the theme.

CSS

Rule NameGlobal classDescription
root.SCToastNotifications-skeleton-rootStyles applied to the root element.

Returns

JSX.Element

Source

packages/react-ui/src/components/ToastNotifications/Skeleton.tsx:34


UserToastNotifications()

UserToastNotifications(inProps): JSX.Element

API documentation for the Community-JS Toast Notifications component. Learn about the available props and the CSS API.

Import

import {ToastNotifications} from '@selfcommunity/react-ui';

Component Name

The name SCToastNotifications can be used when providing style overrides in the theme.

CSS

Rule NameGlobal classDescription
root.SCUserNotifications-rootStyles applied to the root element.
toastMessage.SCUserToastNotifications-toast-messageStyles applied to the toast message element.
toastContent.SCUserToastNotifications-toast-contentStyles applied to the toast content element.
toastActions.SCUserToastNotifications-toast-actionsStyles applied to the toast actions section.

Parameters

ParameterTypeDescription
inPropsToastNotificationsProps

Returns

JSX.Element

Source

packages/react-ui/src/components/ToastNotifications/ToastNotifications.tsx:73