ultra-design
Version:
16 lines (13 loc) • 2.28 kB
JavaScript
import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
import { css } from '@emotion/react';
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
function getDrawerTransform(placement, prefixClassName) {
var placementData = {
top: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n top: 0;\n width: 100%;\n &.", "-enter {\n transform: translateY(-100%);\n }\n &.", "-enter-active {\n transform: translateY(0);\n }\n &.", "-exit {\n transform: translateY(0);\n }\n &.", "-exit-active {\n transform: translateY(-100%);\n }\n "])), prefixClassName, prefixClassName, prefixClassName, prefixClassName),
left: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n left: 0;\n height: 100%;\n &.", "-enter {\n transform: translateX(-100%);\n }\n &.", "-enter-active {\n transform: translateX(0);\n }\n &.", "-exit {\n transform: translateX(0);\n }\n &.", "-exit-active {\n transform: translateX(-100%);\n }\n "])), prefixClassName, prefixClassName, prefixClassName, prefixClassName),
bottom: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n bottom: 0;\n width: 100%;\n &.", "-enter {\n transform: translateY(100%);\n }\n &.", "-enter-active {\n transform: translateY(0);\n }\n &.", "-exit {\n transform: translateY(0);\n }\n &.", "-exit-active {\n transform: translateY(100%);\n }\n "])), prefixClassName, prefixClassName, prefixClassName, prefixClassName),
right: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n height: 100%;\n right: 0;\n &.", "-enter {\n transform: translateX(100%);\n }\n &.", "-enter-active {\n transform: translateX(0);\n }\n &.", "-exit {\n transform: translateX(0);\n }\n &.", "-exit-active {\n transform: translateX(100%);\n }\n "])), prefixClassName, prefixClassName, prefixClassName, prefixClassName)
};
return placementData[placement];
}
export { getDrawerTransform as default };