@progress/kendo-react-common
Version:
React Common package delivers common utilities that can be used with the KendoReact UI components. KendoReact Common Utilities package
185 lines (184 loc) • 8.54 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { base as i, animationStyles as e, containers as a } from "./json-classes.mjs";
const p = {
child: {
container: `${i.prefix}-${e[e.prefix + "-" + a.container]}`,
relative: `${i.prefix}-${e[e.prefix + "-" + a.container + "-" + e.relative]}`
},
childContainer: {
container: `${i.prefix}-${e[e.child + "-" + e.prefix + "-" + a.container]}`
},
appear: {
"push-right": `${i.prefix}-${e.pushRight}-${e.appear}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.appear}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.appear}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.appear}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.appear}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.appear}`,
fade: `${i.prefix}-${e.fade}-${e.appear}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.appear}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.appear}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.appear}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.appear}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.appear}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.appear}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.appear}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.appear}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.appear}`
},
appearActive: {
"push-right": `${i.prefix}-${e.pushRight}-${e.appear}-${e.active}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.appear}-${e.active}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.appear}-${e.active}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.appear}-${e.active}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.appear}-${e.active}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.appear}-${e.active}`,
fade: `${i.prefix}-${e.fade}-${e.appear}-${e.active}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.appear}-${e.active}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.appear}-${e.active}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.appear}-${e.active}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.appear}-${e.active}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.appear}-${e.active}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.appear}-${e.active}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.appear}-${e.active}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.appear}-${e.active}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.appear}-${e.active}`
},
enter: {
"push-right": `${i.prefix}-${e.pushRight}-${e.enter}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.enter}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.enter}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.enter}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.enter}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.enter}`,
fade: `${i.prefix}-${e.fade}-${e.enter}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.enter}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.enter}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.enter}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.enter}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.enter}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.enter}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.enter}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.enter}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.enter}`
},
enterActive: {
"push-right": `${i.prefix}-${e.pushRight}-${e.enter}-${e.active}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.enter}-${e.active}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.enter}-${e.active}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.enter}-${e.active}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.enter}-${e.active}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.enter}-${e.active}`,
fade: `${i.prefix}-${e.fade}-${e.enter}-${e.active}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.enter}-${e.active}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.enter}-${e.active}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.enter}-${e.active}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.enter}-${e.active}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.enter}-${e.active}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.enter}-${e.active}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.enter}-${e.active}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.enter}-${e.active}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.enter}-${e.active}`
},
exit: {
"push-right": `${i.prefix}-${e.pushRight}-${e.exit}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.exit}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.exit}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.exit}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.exit}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.exit}`,
fade: `${i.prefix}-${e.fade}-${e.exit}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.exit}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.exit}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.exit}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.exit}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.exit}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.exit}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.exit}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.exit}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.exit}`
},
exitActive: {
"push-right": `${i.prefix}-${e.pushRight}-${e.exit}-${e.active}`,
"push-left": `${i.prefix}-${e.pushLeft}-${e.exit}-${e.active}`,
"push-down": `${i.prefix}-${e.pushDown}-${e.exit}-${e.active}`,
"push-up": `${i.prefix}-${e.pushUp}-${e.exit}-${e.active}`,
"expand-vertical": `${i.prefix}-${e.expandVertical}-${e.exit}-${e.active}`,
"expand-horizontal": `${i.prefix}-${e.expandHorizontal}-${e.exit}-${e.active}`,
fade: `${i.prefix}-${e.fade}-${e.exit}-${e.active}`,
"zoom-in": `${i.prefix}-${e.zoomIn}-${e.exit}-${e.active}`,
"zoom-out": `${i.prefix}-${e.zoomOut}-${e.exit}-${e.active}`,
"slide-in": `${i.prefix}-${e.slideIn}-${e.exit}-${e.active}`,
"slide-down": `${i.prefix}-${e.slideDown}-${e.exit}-${e.active}`,
"slide-up": `${i.prefix}-${e.slideUp}-${e.exit}-${e.active}`,
"slide-right": `${i.prefix}-${e.slideRight}-${e.exit}-${e.active}`,
"slide-left": `${i.prefix}-${e.slideLeft}-${e.exit}-${e.active}`,
"reveal-vertical": `${i.prefix}-${e.revealVertical}-${e.exit}-${e.active}`,
"reveal-horizontal": `${i.prefix}-${e.revealHorizontal}-${e.exit}-${e.active}`
}
}, x = {
child: (t) => {
const { c: r = p } = t;
return {
[r.child.container]: !0,
[r.child.relative]: !0
};
},
childContainer: (t) => {
const { c: r = p } = t;
return {
[r.childContainer.container]: !0
};
},
appear: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.appear[$]}`]: r.appear[$],
[`${$}-${e.appear}`]: !r.appear[$]
};
},
appearActive: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.appearActive[$]}`]: r.appearActive[$],
[`${$}-${e.appear}-${e.active}`]: !r.appearActive[$]
};
},
enter: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.enter[$]}`]: r.enter[$],
[`${$}-${e.enter}`]: !r.enter[$]
};
},
enterActive: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.enterActive[$]}`]: r.enterActive[$],
[`${$}-${e.enter}-${e.active}`]: !r.enterActive[$]
};
},
exit: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.exit[$]}`]: r.exit[$],
[`${$}-${e.exit}`]: !r.exit[$]
};
},
exitActive: (t) => {
const { c: r = p, transitionName: $ } = t;
return {
[`${r.exitActive[$]}`]: r.exitActive[$],
[`${$}-${e.exit}-${e.active}`]: !r.exitActive[$]
};
}
};
export {
x as uAnimation
};