Fixed #4866 - StyleClass: deprecate enterClass/leaveClass use enterFromClass/leaveFromClass

pull/4869/head
tugcekucukoglu 2023-11-22 16:19:12 +03:00
parent cf1ee45e4c
commit 5088314e3f
2 changed files with 30 additions and 0 deletions

View File

@ -21,8 +21,13 @@ export interface StyleClassOptions {
selector?: '@next' | '@prev' | '@parent' | '@grandparent' | string | undefined; selector?: '@next' | '@prev' | '@parent' | '@grandparent' | string | undefined;
/** /**
* Style class to add when item begins to get displayed. * Style class to add when item begins to get displayed.
* @deprecated since v3.41.0. Use 'enterFromClass' option instead.
*/ */
enterClass?: string | undefined; enterClass?: string | undefined;
/**
* Style class to add when item begins to get displayed.
*/
enterFromClass?: string | undefined;
/** /**
* Style class to add during enter animation. * Style class to add during enter animation.
*/ */
@ -33,8 +38,13 @@ export interface StyleClassOptions {
enterToClass?: string | undefined; enterToClass?: string | undefined;
/** /**
* Style class to add when item begins to get hidden. * Style class to add when item begins to get hidden.
* @deprecated since v3.41.0. Use 'leaveFromClass' option instead.
*/ */
leaveClass?: string | undefined; leaveClass?: string | undefined;
/**
* Style class to add when item begins to get hidden.
*/
leaveFromClass?: string | undefined;
/** /**
* Style class to add during leave animation. * Style class to add during leave animation.
*/ */

View File

@ -51,10 +51,15 @@ const StyleClass = BaseStyleClass.extend('styleclass', {
DomHandler.addClass(target, binding.value.enterActiveClass); DomHandler.addClass(target, binding.value.enterActiveClass);
// enterClass will be deprecated, use enterFromClass
if (binding.value.enterClass) { if (binding.value.enterClass) {
DomHandler.removeClass(target, binding.value.enterClass); DomHandler.removeClass(target, binding.value.enterClass);
} }
if (binding.value.enterFromClass) {
DomHandler.removeClass(target, binding.value.enterFromClass);
}
target.$p_styleclass_enterlistener = () => { target.$p_styleclass_enterlistener = () => {
DomHandler.removeClass(target, binding.value.enterActiveClass); DomHandler.removeClass(target, binding.value.enterActiveClass);
@ -74,10 +79,15 @@ const StyleClass = BaseStyleClass.extend('styleclass', {
target.addEventListener('animationend', target.$p_styleclass_enterlistener); target.addEventListener('animationend', target.$p_styleclass_enterlistener);
} }
} else { } else {
// enterClass will be deprecated, use enterFromClass
if (binding.value.enterClass) { if (binding.value.enterClass) {
DomHandler.removeClass(target, binding.value.enterClass); DomHandler.removeClass(target, binding.value.enterClass);
} }
if (binding.value.enterFromClass) {
DomHandler.removeClass(target, binding.value.enterFromClass);
}
if (binding.value.enterToClass) { if (binding.value.enterToClass) {
DomHandler.addClass(target, binding.value.enterToClass); DomHandler.addClass(target, binding.value.enterToClass);
} }
@ -93,10 +103,15 @@ const StyleClass = BaseStyleClass.extend('styleclass', {
target.$_pstyleclass_animating = true; target.$_pstyleclass_animating = true;
DomHandler.addClass(target, binding.value.leaveActiveClass); DomHandler.addClass(target, binding.value.leaveActiveClass);
// leaveClass will be deprecated, use leaveFromClass
if (binding.value.leaveClass) { if (binding.value.leaveClass) {
DomHandler.removeClass(target, binding.value.leaveClass); DomHandler.removeClass(target, binding.value.leaveClass);
} }
if (binding.value.leaveFromClass) {
DomHandler.removeClass(target, binding.value.leaveFromClass);
}
target.$p_styleclass_leavelistener = () => { target.$p_styleclass_leavelistener = () => {
DomHandler.removeClass(target, binding.value.leaveActiveClass); DomHandler.removeClass(target, binding.value.leaveActiveClass);
@ -111,10 +126,15 @@ const StyleClass = BaseStyleClass.extend('styleclass', {
target.addEventListener('animationend', target.$p_styleclass_leavelistener); target.addEventListener('animationend', target.$p_styleclass_leavelistener);
} }
} else { } else {
// leaveClass will be deprecated, use leaveFromClass
if (binding.value.leaveClass) { if (binding.value.leaveClass) {
DomHandler.removeClass(target, binding.value.leaveClass); DomHandler.removeClass(target, binding.value.leaveClass);
} }
if (binding.value.leaveFromClass) {
DomHandler.removeClass(target, binding.value.leaveFromClass);
}
if (binding.value.leaveToClass) { if (binding.value.leaveToClass) {
DomHandler.addClass(target, binding.value.leaveToClass); DomHandler.addClass(target, binding.value.leaveToClass);
} }