react-simple-game-engine
Version:
[WIP] not able to use in currently. <!-- Document cumming soon... -->
34 lines (33 loc) • 1.85 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
import { jsx as _jsx } from "react/jsx-runtime";
import { useMemo } from "react";
import { useLongPress } from "../hooks/interact";
import { getClassName } from "../utils";
export function Control(_a) {
var _b = _a.xAxisOriginCenter, xAxisOriginCenter = _b === void 0 ? false : _b, _c = _a.yAxisOriginCenter, yAxisOriginCenter = _c === void 0 ? false : _c, top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom, children = _a.children, _d = _a.orientation, orientation = _d === void 0 ? "vertical" : _d, _e = _a.alignment, alignment = _e === void 0 ? "flex-start" : _e, _f = _a.interact, interact = _f === void 0 ? {} : _f;
var longPressProps = useLongPress(interact.onLongPress, interact.delay, interact.exts);
var transform = useMemo(function () {
var x = xAxisOriginCenter ? "".concat(left != null ? -50 : 50, "%") : 0;
var y = yAxisOriginCenter ? "".concat(top != null ? -50 : 50, "%") : 0;
return "translate(".concat(x, ",").concat(y, ")");
}, [left, top, xAxisOriginCenter, yAxisOriginCenter]);
return (_jsx("div", __assign({ className: getClassName("ui-control"), "data-set-top": top != null, style: {
"--top": top,
left: left,
right: right,
bottom: bottom,
flexDirection: orientation === "vertical" ? "column" : "row",
alignItems: alignment,
transform: transform,
} }, longPressProps, { children: children })));
}