Files
aso/frontend/client-portal/src/components/animate/variants/scale.ts
Linksehat Staging Server 70fc1579e7 update
2024-07-12 08:41:18 +07:00

38 lines
1.2 KiB
TypeScript
Executable File

// @types
import { VariantsType } from '../type';
//
import { varTranEnter, varTranExit } from './transition';
// ----------------------------------------------------------------------
export const varScale = (props?: VariantsType) => {
const durationIn = props?.durationIn;
const durationOut = props?.durationOut;
const easeIn = props?.easeIn;
const easeOut = props?.easeOut;
return {
// IN
inX: {
initial: { scaleX: 0, opacity: 0 },
animate: { scaleX: 1, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
exit: { scaleX: 0, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
},
inY: {
initial: { scaleY: 0, opacity: 0 },
animate: { scaleY: 1, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
exit: { scaleY: 0, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
},
// OUT
outX: {
initial: { scaleX: 1, opacity: 1 },
animate: { scaleX: 0, opacity: 0, transition: varTranEnter({ durationIn, easeIn }) },
},
outY: {
initial: { scaleY: 1, opacity: 1 },
animate: { scaleY: 0, opacity: 0, transition: varTranEnter({ durationIn, easeIn }) },
},
};
};