react-base-guide/lib/components/slider/slide.js

react ui components

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = __importDefault(require("styled-components"));
const navigation_1 = __importDefault(require("./navigation"));
const getTransform = (position) => {
    if (position === "prev")
        return "transform: translateX(-50%) rotateY(270deg) translateX(-50%)";
    if (position === "next")
        return "transform: translateX(50%) rotateY(90deg) translateX(50%)";
    return "transform: rotateY(0deg)";
};
const Wrapper = styled_components_1.default.div `
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  ${p => getTransform(p.position)};
  
  >* {
    width: 100%;
    height: 100%;
  }
`;
const Slide = ({ children, onPrev, onNext, disabledNavigation, position }) => ((0, jsx_runtime_1.jsxs)(Wrapper, Object.assign({ position: position }, { children: [children, (0, jsx_runtime_1.jsx)(navigation_1.default, { onPrev: onPrev, onNext: onNext, disabledNavigation: disabledNavigation })] })));
exports.default = Slide;
//# sourceMappingURL=slide.js.map