ultra-design/lib/drawer/drawer-transform.js

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
var react = require('@emotion/react');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);

var _templateObject, _templateObject2, _templateObject3, _templateObject4;
function getDrawerTransform(placement, prefixClassName) {
  var placementData = {
    top: react.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\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: react.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\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: react.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\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: react.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default["default"](["\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];
}

exports["default"] = getDrawerTransform;