@launchmenu/core
Version:
An environment for visual keyboard controlled applets
71 lines • 5.79 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.SlideChangeTransition = 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 SlideChangeTransition = ({ 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();
}, []);
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, style: {
minWidth: "100%",
minHeight: "100%",
transition: `${dirProp} ${duration}ms linear`,
[dirProp]: started ? `-${100 * (children.length - 1)}%` : 0,
position: "relative",
} }, children.map((child, i) => (react_1.default.createElement(Box_1.Box, { css: {
minWidth: "100%",
minHeight: "100%",
maxWidth: "100%",
maxHeight: "100%",
}, key: (react_1.isValidElement(child) && child.key) || i, position: "relative" }, child))))));
};
exports.SlideChangeTransition = SlideChangeTransition;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2xpZGVDaGFuZ2VUcmFuc2l0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvY29udGV4dC9zdGFja3MvdHJhbnNpdGlvbnMvY2hhbmdlL3NsaWRlQ2hhbmdlL1NsaWRlQ2hhbmdlVHJhbnNpdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLCtDQUEwRjtBQUMxRiwyREFBc0Q7QUFFdEQsb0RBQStDO0FBRS9DOztHQUVHO0FBQ0ksTUFBTSxxQkFBcUIsR0FBb0MsQ0FBQyxFQUNuRSxVQUFVLEVBQ1YsUUFBUSxFQUNSLFFBQVEsR0FBRyxHQUFHLEVBQ2QsU0FBUyxHQUFHLE9BQU8sRUFDbkIsUUFBUSxHQUFHLElBQUksR0FDbEIsRUFBRSxFQUFFO0lBQ0QsTUFBTSxDQUFDLE9BQU8sRUFBRSxVQUFVLENBQUMsR0FBRyxnQkFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzlDLE1BQU0sWUFBWSxHQUFHLGNBQU0sRUFBZSxDQUFDO0lBQzNDLGlCQUFTLENBQUMsR0FBRyxFQUFFOztRQUNYLDRGQUE0RjtRQUM1RixNQUFBLFlBQVksQ0FBQyxPQUFPLDBDQUFFLHFCQUFxQixHQUFHO1FBQzlDLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUN6QixDQUFDLEVBQUUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO0lBQ2YsTUFBTSxXQUFXLEdBQUcsbUJBQVcsQ0FBQyxDQUFDLENBQXdCLEVBQUUsRUFBRTtRQUN6RCxJQUFJLENBQUMsQ0FBQyxNQUFNLElBQUksWUFBWSxDQUFDLE9BQU87WUFBRSxPQUFPO1FBQzdDLFVBQVUsYUFBVixVQUFVLHVCQUFWLFVBQVUsR0FBSztRQUNmLENBQUMsQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN4QixDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFFUCxNQUFNLE9BQU8sR0FBRztRQUNaLElBQUksRUFBRSxNQUFNO1FBQ1osS0FBSyxFQUFFLE9BQU87UUFDZCxFQUFFLEVBQUUsS0FBSztRQUNULElBQUksRUFBRSxRQUFRO0tBQ2pCLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDYixNQUFNLFdBQVcsR0FBSTtRQUNqQixJQUFJLEVBQUUsS0FBSztRQUNYLEtBQUssRUFBRSxhQUFhO1FBQ3BCLEVBQUUsRUFBRSxRQUFRO1FBQ1osSUFBSSxFQUFFLGdCQUFnQjtLQUNmLENBQUMsU0FBUyxDQUFDLENBQUM7SUFFdkIsT0FBTyxDQUNILDhCQUFDLGlCQUFPLElBQUMsT0FBTyxFQUFDLE1BQU0sRUFBQyxRQUFRLEVBQUMsUUFBUTtRQUNyQyw4QkFBQyxTQUFHLElBQ0EsT0FBTyxFQUFDLE1BQU0sRUFDZCxLQUFLLEVBQUUsWUFBWSxFQUNuQixhQUFhLEVBQUUsV0FBVyxFQUMxQixlQUFlLEVBQUUsV0FBVyxFQUM1QixLQUFLLEVBQUU7Z0JBQ0gsUUFBUSxFQUFFLE1BQU07Z0JBQ2hCLFNBQVMsRUFBRSxNQUFNO2dCQUNqQixVQUFVLEVBQUUsR0FBRyxPQUFPLElBQUksUUFBUSxXQUFXO2dCQUM3QyxDQUFDLE9BQU8sQ0FBQyxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUMsSUFBSSxHQUFHLEdBQUcsQ0FBQyxRQUFRLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUM7Z0JBQzNELFFBQVEsRUFBRSxVQUFVO2FBQ3ZCLElBQ0EsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEtBQUssRUFBRSxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQ3hCLDhCQUFDLFNBQUcsSUFDQSxHQUFHLEVBQUU7Z0JBQ0QsUUFBUSxFQUFFLE1BQU07Z0JBQ2hCLFNBQVMsRUFBRSxNQUFNO2dCQUNqQixRQUFRLEVBQUUsTUFBTTtnQkFDaEIsU0FBUyxFQUFFLE1BQU07YUFDcEIsRUFDRCxHQUFHLEVBQUUsQ0FBQyxzQkFBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLEtBQUssQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLEVBQzlDLFFBQVEsRUFBQyxVQUFVLElBQ2xCLEtBQUssQ0FDSixDQUNULENBQUMsQ0FDQSxDQUNBLENBQ2IsQ0FBQztBQUNOLENBQUMsQ0FBQztBQS9EVyxRQUFBLHFCQUFxQix5QkErRGhDIn0=