refactor(toast): remove cssClass from ToastButton (#28977)

BREAKING CHANGE:
The `cssClass` property has been removed from `ToastButton`
This commit is contained in:
Maria Hutt
2024-02-06 09:09:03 -08:00
committed by GitHub
parent 7fd7e1d9b8
commit 9856295915
3 changed files with 6 additions and 7 deletions

View File

@ -162,3 +162,9 @@ For more information on the dynamic font, refer to the [Dynamic Font Scaling doc
- `ion-picker` and `ion-picker-column` have been renamed to `ion-picker-legacy` and `ion-picker-legacy-column`, respectively. This change was made to accommodate the new inline picker component while allowing developers to continue to use the legacy picker during this migration period. - `ion-picker` and `ion-picker-column` have been renamed to `ion-picker-legacy` and `ion-picker-legacy-column`, respectively. This change was made to accommodate the new inline picker component while allowing developers to continue to use the legacy picker during this migration period.
- Only the component names have been changed. Usages such as `ion-picker` or `IonPicker` should be changed to `ion-picker-legacy` and `IonPickerLegacy`, respectively. - Only the component names have been changed. Usages such as `ion-picker` or `IonPicker` should be changed to `ion-picker-legacy` and `IonPickerLegacy`, respectively.
- Non-component usages such as `pickerController` or `useIonPicker` remain unchanged. The new picker displays inline with your page content and does not have equivalents for these non-component usages. - Non-component usages such as `pickerController` or `useIonPicker` remain unchanged. The new picker displays inline with your page content and does not have equivalents for these non-component usages.
<h4 id="version-8x-toast">Toast</h4>
- `cssClass` has been removed from the `ToastButton` interface. This was previously used to apply a custom class to the toast buttons. Developers can use the "button" shadow part to style the buttons.
For more information on styling toast buttons, refer to the [Toast Theming documentation](https://ionicframework.com/docs/api/toast#theming).

View File

@ -27,18 +27,12 @@ export interface ToastOptions {
export type ToastLayout = 'baseline' | 'stacked'; export type ToastLayout = 'baseline' | 'stacked';
// TODO FW-4923 remove cssClass property
export interface ToastButton { export interface ToastButton {
text?: string; text?: string;
icon?: string; icon?: string;
side?: 'start' | 'end'; side?: 'start' | 'end';
role?: 'cancel' | string; role?: 'cancel' | string;
/**
* @deprecated Use the toast button's CSS Shadow Parts instead.
*/
cssClass?: string | string[];
htmlAttributes?: { [key: string]: any }; htmlAttributes?: { [key: string]: any };
handler?: () => boolean | void | Promise<boolean | void>; handler?: () => boolean | void | Promise<boolean | void>;
} }

View File

@ -778,7 +778,6 @@ const buttonClass = (button: ToastButton): CssClassMap => {
[`toast-button-${button.role}`]: button.role !== undefined, [`toast-button-${button.role}`]: button.role !== undefined,
'ion-focusable': true, 'ion-focusable': true,
'ion-activatable': true, 'ion-activatable': true,
...getClassMap(button.cssClass),
}; };
}; };