feat(toast): expose shadow parts (#20146)

resolves #19722
This commit is contained in:
Liam DeBeasi
2020-01-06 15:53:26 -05:00
committed by GitHub
parent 808b1bd461
commit 3b4988aa60

View File

@ -233,7 +233,7 @@ export class Toast implements ComponentInterface, OverlayInterface {
return ( return (
<div class={buttonGroupsClasses}> <div class={buttonGroupsClasses}>
{buttons.map(b => {buttons.map(b =>
<button type="button" class={buttonClass(b)} tabIndex={0} onClick={() => this.buttonClick(b)}> <button type="button" class={buttonClass(b)} tabIndex={0} onClick={() => this.buttonClick(b)} part="button">
<div class="toast-button-inner"> <div class="toast-button-inner">
{b.icon && {b.icon &&
<ion-icon <ion-icon
@ -275,15 +275,15 @@ export class Toast implements ComponentInterface, OverlayInterface {
onIonToastWillDismiss={this.dispatchCancelHandler} onIonToastWillDismiss={this.dispatchCancelHandler}
> >
<div class={wrapperClass}> <div class={wrapperClass}>
<div class="toast-container"> <div class="toast-container" part="container">
{this.renderButtons(startButtons, 'start')} {this.renderButtons(startButtons, 'start')}
<div class="toast-content"> <div class="toast-content">
{this.header !== undefined && {this.header !== undefined &&
<div class="toast-header">{this.header}</div> <div class="toast-header" part="header">{this.header}</div>
} }
{this.message !== undefined && {this.message !== undefined &&
<div class="toast-message" innerHTML={sanitizeDOMString(this.message)}></div> <div class="toast-message" part="message" innerHTML={sanitizeDOMString(this.message)}></div>
} }
</div> </div>