@launchmenu/core
Version:
An environment for visual keyboard controlled applets
73 lines • 5.57 kB
JavaScript
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.SlideCloseTransition = void 0;
const react_1 = __importStar(require("react"));
const Box_1 = require("../../../../../../styling/box/Box");
const FillBox_1 = require("../../../../../FillBox");
/**
* A simple sliding transition
*/
const SlideCloseTransition = ({ onComplete, children, duration = 150, direction = "right", activate = true, }) => {
const [started, setStarted] = react_1.useState(false);
const transitionEl = react_1.useRef();
react_1.useEffect(() => {
var _a;
// Force reflow in order to not skip animation: https://stackoverflow.com/a/45431539/8521718
(_a = transitionEl.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
setStarted(activate);
}, [activate]);
const _onComplete = react_1.useCallback((e) => {
if (e.target != transitionEl.current)
return;
onComplete === null || onComplete === void 0 ? void 0 : onComplete();
e.stopPropagation();
e.preventDefault();
}, []);
const dirProp = {
left: "left",
right: "right",
up: "top",
down: "bottom",
}[direction];
const flexDirProp = {
left: "row",
right: "row-reverse",
up: "column",
down: "column-reverse",
}[direction];
return (react_1.default.createElement(FillBox_1.FillBox, { display: "flex", overflow: "hidden" },
react_1.default.createElement(Box_1.Box, { display: "flex", elRef: transitionEl, flexDirection: flexDirProp, onTransitionEnd: _onComplete, css: {
minWidth: "100%",
minHeight: "100%",
transition: started ? `${dirProp} ${duration}ms linear` : "",
[dirProp]: started ? `-100%` : 0,
position: "relative",
} },
react_1.default.createElement(Box_1.Box, { css: {
minWidth: "100%",
minHeight: "100%",
maxWidth: "100%",
maxHeight: "100%",
}, position: "relative" }, children))));
};
exports.SlideCloseTransition = SlideCloseTransition;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2xpZGVDbG9zZVRyYW5zaXRpb24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9jb250ZXh0L3N0YWNrcy90cmFuc2l0aW9ucy9jbG9zZS9zbGlkZUNsb3NlL1NsaWRlQ2xvc2VUcmFuc2l0aW9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsK0NBQTBFO0FBQzFFLDJEQUFzRDtBQUV0RCxvREFBK0M7QUFFL0M7O0dBRUc7QUFDSSxNQUFNLG9CQUFvQixHQUFtQyxDQUFDLEVBQ2pFLFVBQVUsRUFDVixRQUFRLEVBQ1IsUUFBUSxHQUFHLEdBQUcsRUFDZCxTQUFTLEdBQUcsT0FBTyxFQUNuQixRQUFRLEdBQUcsSUFBSSxHQUNsQixFQUFFLEVBQUU7SUFDRCxNQUFNLENBQUMsT0FBTyxFQUFFLFVBQVUsQ0FBQyxHQUFHLGdCQUFRLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDOUMsTUFBTSxZQUFZLEdBQUcsY0FBTSxFQUFlLENBQUM7SUFDM0MsaUJBQVMsQ0FBQyxHQUFHLEVBQUU7O1FBQ1gsNEZBQTRGO1FBQzVGLE1BQUEsWUFBWSxDQUFDLE9BQU8sMENBQUUscUJBQXFCLEdBQUc7UUFDOUMsVUFBVSxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3pCLENBQUMsRUFBRSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUM7SUFDZixNQUFNLFdBQVcsR0FBRyxtQkFBVyxDQUFDLENBQUMsQ0FBd0IsRUFBRSxFQUFFO1FBQ3pELElBQUksQ0FBQyxDQUFDLE1BQU0sSUFBSSxZQUFZLENBQUMsT0FBTztZQUFFLE9BQU87UUFDN0MsVUFBVSxhQUFWLFVBQVUsdUJBQVYsVUFBVSxHQUFLO1FBQ2YsQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3BCLENBQUMsQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUN2QixDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFFUCxNQUFNLE9BQU8sR0FBRztRQUNaLElBQUksRUFBRSxNQUFNO1FBQ1osS0FBSyxFQUFFLE9BQU87UUFDZCxFQUFFLEVBQUUsS0FBSztRQUNULElBQUksRUFBRSxRQUFRO0tBQ2pCLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDYixNQUFNLFdBQVcsR0FBSTtRQUNqQixJQUFJLEVBQUUsS0FBSztRQUNYLEtBQUssRUFBRSxhQUFhO1FBQ3BCLEVBQUUsRUFBRSxRQUFRO1FBQ1osSUFBSSxFQUFFLGdCQUFnQjtLQUNmLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDdkIsT0FBTyxDQUNILDhCQUFDLGlCQUFPLElBQUMsT0FBTyxFQUFDLE1BQU0sRUFBQyxRQUFRLEVBQUMsUUFBUTtRQUNyQyw4QkFBQyxTQUFHLElBQ0EsT0FBTyxFQUFDLE1BQU0sRUFDZCxLQUFLLEVBQUUsWUFBWSxFQUNuQixhQUFhLEVBQUUsV0FBVyxFQUMxQixlQUFlLEVBQUUsV0FBVyxFQUM1QixHQUFHLEVBQUU7Z0JBQ0QsUUFBUSxFQUFFLE1BQU07Z0JBQ2hCLFNBQVMsRUFBRSxNQUFNO2dCQUNqQixVQUFVLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQyxHQUFHLE9BQU8sSUFBSSxRQUFRLFdBQVcsQ0FBQyxDQUFDLENBQUMsRUFBRTtnQkFDNUQsQ0FBQyxPQUFPLENBQUMsRUFBRSxPQUFPLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQztnQkFDaEMsUUFBUSxFQUFFLFVBQVU7YUFDdkI7WUFDRCw4QkFBQyxTQUFHLElBQ0EsR0FBRyxFQUFFO29CQUNELFFBQVEsRUFBRSxNQUFNO29CQUNoQixTQUFTLEVBQUUsTUFBTTtvQkFDakIsUUFBUSxFQUFFLE1BQU07b0JBQ2hCLFNBQVMsRUFBRSxNQUFNO2lCQUNwQixFQUNELFFBQVEsRUFBQyxVQUFVLElBQ2xCLFFBQVEsQ0FDUCxDQUNKLENBQ0EsQ0FDYixDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBNURXLFFBQUEsb0JBQW9CLHdCQTREL0IifQ==
;