react-simple-game-engine 0.3.23 → 0.3.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,7 +2,8 @@ import { ReactElement } from "react";
2
2
  declare type ControlContainerProps = {
3
3
  full?: boolean;
4
4
  children: ReactElement | ReactElement[];
5
+ stack?: boolean;
5
6
  };
6
- export declare function ControlContainer({ full, children }: ControlContainerProps): JSX.Element;
7
+ export declare function ControlContainer({ stack, full, children, }: ControlContainerProps): JSX.Element;
7
8
  export {};
8
9
  //# sourceMappingURL=control-container.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"control-container.d.ts","sourceRoot":"","sources":["../../src/ui-components/control-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAE9C,aAAK,qBAAqB,GAAG;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;CACzC,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,qBAAqB,eAsBzE"}
1
+ {"version":3,"file":"control-container.d.ts","sourceRoot":"","sources":["../../src/ui-components/control-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAG9C,aAAK,qBAAqB,GAAG;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,KAAa,EACb,IAAI,EACJ,QAAQ,GACT,EAAE,qBAAqB,eAsBvB"}
@@ -11,8 +11,9 @@ var __assign = (this && this.__assign) || function () {
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { useMemo } from "react";
14
+ import { getClassName } from "../utils";
14
15
  export function ControlContainer(_a) {
15
- var full = _a.full, children = _a.children;
16
+ var _b = _a.stack, stack = _b === void 0 ? false : _b, full = _a.full, children = _a.children;
16
17
  var _children = useMemo(function () {
17
18
  var _children = Array.isArray(children) ? children : [children];
18
19
  return _children
@@ -22,9 +23,7 @@ export function ControlContainer(_a) {
22
23
  }, [])
23
24
  .filter(Boolean);
24
25
  }, [children]);
25
- return (_jsx("div", __assign({ style: {
26
- width: "100%",
26
+ return (_jsx("div", __assign({ className: getClassName("control-container"), "data-stack": stack, style: {
27
27
  height: full ? "100%" : undefined,
28
- position: "relative",
29
28
  } }, { children: _children })));
30
29
  }
@@ -1,7 +1,6 @@
1
1
  import { ReactNode } from "react";
2
2
  import { UseLongPressProps } from "../hooks/interact";
3
3
  export declare type ControlProps = {
4
- type?: "abs" | "rel";
5
4
  top?: number;
6
5
  left?: number;
7
6
  right?: number;
@@ -13,5 +12,5 @@ export declare type ControlProps = {
13
12
  alignment?: "flex-start" | "center" | "flex-end";
14
13
  interact?: Partial<UseLongPressProps>;
15
14
  };
16
- export declare function Control({ type, xAxisOriginCenter, yAxisOriginCenter, top, left, right, bottom, children, orientation, alignment, interact, }: ControlProps): JSX.Element;
15
+ export declare function Control({ xAxisOriginCenter, yAxisOriginCenter, top, left, right, bottom, children, orientation, alignment, interact, }: ControlProps): JSX.Element;
17
16
  //# sourceMappingURL=control.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../src/ui-components/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAgB,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAGpE,oBAAY,YAAY,GAAG;IACzB,IAAI,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC,SAAS,CAAC,EAAE,YAAY,GAAG,QAAQ,GAAG,UAAU,CAAC;IAEjD,QAAQ,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACvC,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,IAAY,EACZ,iBAAyB,EACzB,iBAAyB,EACzB,GAAG,EACH,IAAI,EACJ,KAAK,EACL,MAAM,EACN,QAAQ,EACR,WAAwB,EACxB,SAAwB,EACxB,QAAa,GACd,EAAE,YAAY,eA6Bd"}
1
+ {"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../src/ui-components/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA0B,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAgB,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAGpE,oBAAY,YAAY,GAAG;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC,SAAS,CAAC,EAAE,YAAY,GAAG,QAAQ,GAAG,UAAU,CAAC;IAEjD,QAAQ,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACvC,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,iBAAyB,EACzB,iBAAyB,EACzB,GAAG,EACH,IAAI,EACJ,KAAK,EACL,MAAM,EACN,QAAQ,EACR,WAAwB,EACxB,SAAwB,EACxB,QAAa,GACd,EAAE,YAAY,eAgCd"}
@@ -14,15 +14,15 @@ import { useMemo } from "react";
14
14
  import { useLongPress } from "../hooks/interact";
15
15
  import { getClassName } from "../utils";
16
16
  export function Control(_a) {
17
- var _b = _a.type, type = _b === void 0 ? "abs" : _b, _c = _a.xAxisOriginCenter, xAxisOriginCenter = _c === void 0 ? false : _c, _d = _a.yAxisOriginCenter, yAxisOriginCenter = _d === void 0 ? false : _d, top = _a.top, left = _a.left, right = _a.right, bottom = _a.bottom, children = _a.children, _e = _a.orientation, orientation = _e === void 0 ? "vertical" : _e, _f = _a.alignment, alignment = _f === void 0 ? "flex-start" : _f, _g = _a.interact, interact = _g === void 0 ? {} : _g;
17
+ 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;
18
18
  var longPressProps = useLongPress(interact.onLongPress, interact.delay, interact.exts);
19
19
  var transform = useMemo(function () {
20
20
  var x = xAxisOriginCenter ? "".concat(left != null ? -50 : 50, "%") : 0;
21
21
  var y = yAxisOriginCenter ? "".concat(top != null ? -50 : 50, "%") : 0;
22
22
  return "translate(".concat(x, ",").concat(y, ")");
23
23
  }, [left, top, xAxisOriginCenter, yAxisOriginCenter]);
24
- return (_jsx("div", __assign({ className: getClassName("ui-control".concat(type === "rel" ? "-relative" : "")), style: {
25
- top: top,
24
+ return (_jsx("div", __assign({ className: getClassName("ui-control"), "data-set-top": top != null, style: {
25
+ "--top": top,
26
26
  left: left,
27
27
  right: right,
28
28
  bottom: bottom,
@@ -1 +1 @@
1
- {"version":3,"file":"game-bootstrap.d.ts","sourceRoot":"","sources":["../../src/ui-components/game-bootstrap.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAmB,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAG1E,OAAO,EAAe,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAErE,aAAK,cAAc,GAAG,sBAAsB,GAAG;IAC7C,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,eA2M3E"}
1
+ {"version":3,"file":"game-bootstrap.d.ts","sourceRoot":"","sources":["../../src/ui-components/game-bootstrap.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAmB,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAG1E,OAAO,EAAe,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAErE,aAAK,cAAc,GAAG,sBAAsB,GAAG;IAC7C,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,eA2N3E"}
@@ -55,7 +55,9 @@ export function GameBootstrap(_a) {
55
55
  document.head.appendChild(style);
56
56
  var gameRootClass = getClassName("game-root");
57
57
  var gameLoggerClass = getClassName("game-logger");
58
- style.appendChild(document.createTextNode("\n .".concat(getClassName("assets-fail-view"), "{\n background-color: #f28181a1;\n min-height: 100px;\n padding: 10px;\n color: #000;\n }\n \n .").concat(getClassName("game-modal"), " {\n position: fixed;\n top: 0;\n left: 0;\n }\n\n .").concat(getClassName("scene-modal-stack"), "{\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 0;\n z-index: 2;\n }\n \n .").concat(getClassName("modal-content-main"), "{\n position: relative;\n z-index: 1;\n min-width: 200px;\n min-height: 200px;\n }\n\n .").concat(getClassName("modal-content-closer"), "{\n width: 100%;\n height: 100%;\n position: absolute;\n z-index: 0;\n }\n .").concat(getClassName("modal-content-centered"), "{\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .").concat(getClassName("modal-content-wrap"), "{\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n\n .").concat(gameRootClass, ", .").concat(gameRootClass, " *,\n .").concat(gameLoggerClass, ", .").concat(gameLoggerClass, " *\n {\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-tap-highlight-color: rgba(0,0,0,0);\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n text-size-adjust: none;\n }\n\n .").concat(gameRootClass, " {\n overflow: hidden;\n position: relative;\n }\n\n .").concat(gameLoggerClass, " {\n z-index: 4;\n position: fixed;\n top:0;\n right:0;\n }\n\n .").concat(getClassName("message-stack"), " {\n width: cacl(100vw - 40px);\n max-width: 300px;\n max-height: calc(50vh - 50px);\n min-width: 200px;\n min-height: 150px;\n position: absolute;\n top: 5px;\n right: 5px;\n padding: 5px;\n background-color: #0000007b;\n color: #fff;\n font-size: 0.8rem;\n\n display: flex;\n flex-direction: column;\n }\n\n .").concat(getClassName("message-stack-heading"), "{\n width: 100%;\n display: flex;\n justify-content: flex-end;\n }\n\n .").concat(getClassName("message-stack-content"), "{\n flex: 1;\n width: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n\n .").concat(getClassName("float-container"), " {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n\n .").concat(getClassName("float-container"), " > div {\n position: relative;\n width: 100%;\n height: 100%;\n }\n\n .").concat(getClassName("ui-control"), " {\n position: absolute;\n display: inline-flex;\n }\n\n .").concat(getClassName("ui-control-relative"), " {\n position: relative;\n display: inline-flex;\n }\n\n\n .").concat(getClassName("scaler-container"), " {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n\n .").concat(getClassName("scaler-container"), " > div {\n transform-origin: left top;\n position: relative;\n top: 50%;\n left: 50%;\n }\n ")));
58
+ var uiControlClass = getClassName("ui-control");
59
+ var controlContainerClass = getClassName("control-container");
60
+ style.appendChild(document.createTextNode("\n .".concat(getClassName("assets-fail-view"), "{\n background-color: #f28181a1;\n min-height: 100px;\n padding: 10px;\n color: #000;\n }\n \n .").concat(getClassName("game-modal"), " {\n position: fixed;\n top: 0;\n left: 0;\n }\n\n .").concat(getClassName("scene-modal-stack"), "{\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 0;\n z-index: 2;\n }\n \n .").concat(getClassName("modal-content-main"), "{\n position: relative;\n z-index: 1;\n min-width: 200px;\n min-height: 200px;\n }\n\n .").concat(getClassName("modal-content-closer"), "{\n width: 100%;\n height: 100%;\n position: absolute;\n z-index: 0;\n }\n .").concat(getClassName("modal-content-centered"), "{\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .").concat(getClassName("modal-content-wrap"), "{\n width: 100%;\n height: 100%;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n\n .").concat(gameRootClass, ", .").concat(gameRootClass, " *,\n .").concat(gameLoggerClass, ", .").concat(gameLoggerClass, " *\n {\n box-sizing: border-box;\n -webkit-touch-callout: none;\n -webkit-tap-highlight-color: rgba(0,0,0,0);\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n text-size-adjust: none;\n }\n\n .").concat(gameRootClass, " {\n overflow: hidden;\n position: relative;\n }\n\n .").concat(gameLoggerClass, " {\n z-index: 4;\n position: fixed;\n top:0;\n right:0;\n }\n\n .").concat(getClassName("message-stack"), " {\n width: cacl(100vw - 40px);\n max-width: 300px;\n max-height: calc(50vh - 50px);\n min-width: 200px;\n min-height: 150px;\n position: absolute;\n top: 5px;\n right: 5px;\n padding: 5px;\n background-color: #0000007b;\n color: #fff;\n font-size: 0.8rem;\n\n display: flex;\n flex-direction: column;\n }\n\n .").concat(getClassName("message-stack-heading"), "{\n width: 100%;\n display: flex;\n justify-content: flex-end;\n }\n\n .").concat(getClassName("message-stack-content"), "{\n flex: 1;\n width: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n\n .").concat(getClassName("float-container"), " {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n\n .").concat(getClassName("float-container"), " > div {\n position: relative;\n width: 100%;\n height: 100%;\n }\n \n .").concat(uiControlClass, " {\n position: absolute;\n display: inline-flex;\n }\n \n .").concat(uiControlClass, "[data-set-top=\"true\"] {\n top: calc(var(--top) * 1px);\n }\n\n .").concat(controlContainerClass, " {\n width: 100%;\n position: relative;\n }\n\n .").concat(controlContainerClass, "[data-stack=\"true\"] .").concat(uiControlClass, " {\n position: relative;\n display: flex;\n \n }\n \n .").concat(controlContainerClass, "[data-stack=\"true\"] .").concat(uiControlClass, "[data-set-top=\"true\"] {\n top: unset;\n margin-top: calc(var(--top) * 1px);\n }\n\n .").concat(getClassName("scaler-container"), " {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n\n .").concat(getClassName("scaler-container"), " > div {\n transform-origin: left top;\n position: relative;\n top: 50%;\n left: 50%;\n }\n ")));
59
61
  }, []);
60
62
  return (_jsxs(_Fragment, { children: [_jsx(SceneRunner, __assign({ current: currentScene }, props), currentScene.sessionId), logPopup && _jsx(Logger, {})] }));
61
63
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-simple-game-engine",
3
- "version": "0.3.23",
3
+ "version": "0.3.25",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib",