@alexium216/react-pong 1.1.2 → 1.1.3

package/dist/react-pong.es.js

@@ -1,760 +1,132 @@
-import $e, { useState as dr, useRef as B, useEffect as Fe } from "react";
-var oe = { exports: {} }, Q = {};
-/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var Ie;
-function vr() {
-  if (Ie) return Q;
-  Ie = 1;
-  var _ = $e, c = Symbol.for("react.element"), E = Symbol.for("react.fragment"), x = Object.prototype.hasOwnProperty, o = _.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, f = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function b(m, h, p) {
-    var s, a = {}, O = null, S = null;
-    p !== void 0 && (O = "" + p), h.key !== void 0 && (O = "" + h.key), h.ref !== void 0 && (S = h.ref);
-    for (s in h) x.call(h, s) && !f.hasOwnProperty(s) && (a[s] = h[s]);
-    if (m && m.defaultProps) for (s in h = m.defaultProps, h) a[s] === void 0 && (a[s] = h[s]);
-    return { $$typeof: c, type: m, key: O, ref: S, props: a, _owner: o.current };
-  }
-  return Q.Fragment = E, Q.jsx = b, Q.jsxs = b, Q;
-}
-var ee = {};
-/**
- * @license React
- * react-jsx-runtime.development.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var We;
-function pr() {
-  return We || (We = 1, process.env.NODE_ENV !== "production" && (function() {
-    var _ = $e, c = Symbol.for("react.element"), E = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), f = Symbol.for("react.profiler"), b = Symbol.for("react.provider"), m = Symbol.for("react.context"), h = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), s = Symbol.for("react.suspense_list"), a = Symbol.for("react.memo"), O = Symbol.for("react.lazy"), S = Symbol.for("react.offscreen"), N = Symbol.iterator, L = "@@iterator";
-    function C(e) {
-      if (e === null || typeof e != "object")
-        return null;
-      var r = N && e[N] || e[L];
-      return typeof r == "function" ? r : null;
-    }
-    var k = _.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-    function d(e) {
-      {
-        for (var r = arguments.length, t = new Array(r > 1 ? r - 1 : 0), n = 1; n < r; n++)
-          t[n - 1] = arguments[n];
-        D("error", e, t);
-      }
-    }
-    function D(e, r, t) {
-      {
-        var n = k.ReactDebugCurrentFrame, u = n.getStackAddendum();
-        u !== "" && (r += "%s", t = t.concat([u]));
-        var v = t.map(function(l) {
-          return String(l);
-        });
-        v.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, v);
-      }
-    }
-    var U = !1, z = !1, F = !1, w = !1, J = !1, K;
-    K = Symbol.for("react.module.reference");
-    function ie(e) {
-      return !!(typeof e == "string" || typeof e == "function" || e === x || e === f || J || e === o || e === p || e === s || w || e === S || U || z || F || typeof e == "object" && e !== null && (e.$$typeof === O || e.$$typeof === a || e.$$typeof === b || e.$$typeof === m || e.$$typeof === h || // This needs to include all possible module reference object
-      // types supported by any Flight configuration anywhere since
-      // we don't know which Flight build this will end up being used
-      // with.
-      e.$$typeof === K || e.getModuleId !== void 0));
-    }
-    function le(e, r, t) {
-      var n = e.displayName;
-      if (n)
-        return n;
-      var u = r.displayName || r.name || "";
-      return u !== "" ? t + "(" + u + ")" : t;
-    }
-    function X(e) {
-      return e.displayName || "Context";
-    }
-    function I(e) {
-      if (e == null)
-        return null;
-      if (typeof e.tag == "number" && d("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
-        return e.displayName || e.name || null;
-      if (typeof e == "string")
-        return e;
-      switch (e) {
-        case x:
-          return "Fragment";
-        case E:
-          return "Portal";
-        case f:
-          return "Profiler";
-        case o:
-          return "StrictMode";
-        case p:
-          return "Suspense";
-        case s:
-          return "SuspenseList";
-      }
-      if (typeof e == "object")
-        switch (e.$$typeof) {
-          case m:
-            var r = e;
-            return X(r) + ".Consumer";
-          case b:
-            var t = e;
-            return X(t._context) + ".Provider";
-          case h:
-            return le(e, e.render, "ForwardRef");
-          case a:
-            var n = e.displayName || null;
-            return n !== null ? n : I(e.type) || "Memo";
-          case O: {
-            var u = e, v = u._payload, l = u._init;
-            try {
-              return I(l(v));
-            } catch {
-              return null;
-            }
-          }
-        }
-      return null;
-    }
-    var M = Object.assign, y = 0, j, Y, W, V, $, he, be;
-    function ge() {
-    }
-    ge.__reactDisabledLog = !0;
-    function Ye() {
-      {
-        if (y === 0) {
-          j = console.log, Y = console.info, W = console.warn, V = console.error, $ = console.group, he = console.groupCollapsed, be = console.groupEnd;
-          var e = {
-            configurable: !0,
-            enumerable: !0,
-            value: ge,
-            writable: !0
-          };
-          Object.defineProperties(console, {
-            info: e,
-            log: e,
-            warn: e,
-            error: e,
-            group: e,
-            groupCollapsed: e,
-            groupEnd: e
-          });
-        }
-        y++;
-      }
-    }
-    function Le() {
-      {
-        if (y--, y === 0) {
-          var e = {
-            configurable: !0,
-            enumerable: !0,
-            writable: !0
-          };
-          Object.defineProperties(console, {
-            log: M({}, e, {
-              value: j
-            }),
-            info: M({}, e, {
-              value: Y
-            }),
-            warn: M({}, e, {
-              value: W
-            }),
-            error: M({}, e, {
-              value: V
-            }),
-            group: M({}, e, {
-              value: $
-            }),
-            groupCollapsed: M({}, e, {
-              value: he
-            }),
-            groupEnd: M({}, e, {
-              value: be
-            })
-          });
-        }
-        y < 0 && d("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
-      }
-    }
-    var se = k.ReactCurrentDispatcher, ue;
-    function re(e, r, t) {
-      {
-        if (ue === void 0)
-          try {
-            throw Error();
-          } catch (u) {
-            var n = u.stack.trim().match(/\n( *(at )?)/);
-            ue = n && n[1] || "";
-          }
-        return `
-` + ue + e;
-      }
-    }
-    var ce = !1, te;
-    {
-      var Ue = typeof WeakMap == "function" ? WeakMap : Map;
-      te = new Ue();
-    }
-    function me(e, r) {
-      if (!e || ce)
-        return "";
-      {
-        var t = te.get(e);
-        if (t !== void 0)
-          return t;
-      }
-      var n;
-      ce = !0;
-      var u = Error.prepareStackTrace;
-      Error.prepareStackTrace = void 0;
-      var v;
-      v = se.current, se.current = null, Ye();
-      try {
-        if (r) {
-          var l = function() {
-            throw Error();
-          };
-          if (Object.defineProperty(l.prototype, "props", {
-            set: function() {
-              throw Error();
-            }
-          }), typeof Reflect == "object" && Reflect.construct) {
-            try {
-              Reflect.construct(l, []);
-            } catch (P) {
-              n = P;
-            }
-            Reflect.construct(e, [], l);
-          } else {
-            try {
-              l.call();
-            } catch (P) {
-              n = P;
-            }
-            e.call(l.prototype);
-          }
-        } else {
-          try {
-            throw Error();
-          } catch (P) {
-            n = P;
-          }
-          e();
-        }
-      } catch (P) {
-        if (P && n && typeof P.stack == "string") {
-          for (var i = P.stack.split(`
-`), T = n.stack.split(`
-`), g = i.length - 1, R = T.length - 1; g >= 1 && R >= 0 && i[g] !== T[R]; )
-            R--;
-          for (; g >= 1 && R >= 0; g--, R--)
-            if (i[g] !== T[R]) {
-              if (g !== 1 || R !== 1)
-                do
-                  if (g--, R--, R < 0 || i[g] !== T[R]) {
-                    var A = `
-` + i[g].replace(" at new ", " at ");
-                    return e.displayName && A.includes("<anonymous>") && (A = A.replace("<anonymous>", e.displayName)), typeof e == "function" && te.set(e, A), A;
-                  }
-                while (g >= 1 && R >= 0);
-              break;
-            }
-        }
-      } finally {
-        ce = !1, se.current = v, Le(), Error.prepareStackTrace = u;
-      }
-      var H = e ? e.displayName || e.name : "", q = H ? re(H) : "";
-      return typeof e == "function" && te.set(e, q), q;
-    }
-    function ze(e, r, t) {
-      return me(e, !1);
-    }
-    function Ve(e) {
-      var r = e.prototype;
-      return !!(r && r.isReactComponent);
-    }
-    function ne(e, r, t) {
-      if (e == null)
-        return "";
-      if (typeof e == "function")
-        return me(e, Ve(e));
-      if (typeof e == "string")
-        return re(e);
-      switch (e) {
-        case p:
-          return re("Suspense");
-        case s:
-          return re("SuspenseList");
-      }
-      if (typeof e == "object")
-        switch (e.$$typeof) {
-          case h:
-            return ze(e.render);
-          case a:
-            return ne(e.type, r, t);
-          case O: {
-            var n = e, u = n._payload, v = n._init;
-            try {
-              return ne(v(u), r, t);
-            } catch {
-            }
-          }
-        }
-      return "";
-    }
-    var Z = Object.prototype.hasOwnProperty, Re = {}, _e = k.ReactDebugCurrentFrame;
-    function ae(e) {
-      if (e) {
-        var r = e._owner, t = ne(e.type, e._source, r ? r.type : null);
-        _e.setExtraStackFrame(t);
-      } else
-        _e.setExtraStackFrame(null);
-    }
-    function Be(e, r, t, n, u) {
-      {
-        var v = Function.call.bind(Z);
-        for (var l in e)
-          if (v(e, l)) {
-            var i = void 0;
-            try {
-              if (typeof e[l] != "function") {
-                var T = Error((n || "React class") + ": " + t + " type `" + l + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[l] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
-                throw T.name = "Invariant Violation", T;
-              }
-              i = e[l](r, l, n, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (g) {
-              i = g;
-            }
-            i && !(i instanceof Error) && (ae(u), d("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", n || "React class", t, l, typeof i), ae(null)), i instanceof Error && !(i.message in Re) && (Re[i.message] = !0, ae(u), d("Failed %s type: %s", t, i.message), ae(null));
-          }
-      }
-    }
-    var Ne = Array.isArray;
-    function fe(e) {
-      return Ne(e);
-    }
-    function Je(e) {
-      {
-        var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return t;
-      }
-    }
-    function Ke(e) {
-      try {
-        return Ee(e), !1;
-      } catch {
-        return !0;
-      }
-    }
-    function Ee(e) {
-      return "" + e;
-    }
-    function xe(e) {
-      if (Ke(e))
-        return d("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Je(e)), Ee(e);
-    }
-    var Se = k.ReactCurrentOwner, qe = {
-      key: !0,
-      ref: !0,
-      __self: !0,
-      __source: !0
-    }, Te, we;
-    function Ge(e) {
-      if (Z.call(e, "ref")) {
-        var r = Object.getOwnPropertyDescriptor(e, "ref").get;
-        if (r && r.isReactWarning)
-          return !1;
-      }
-      return e.ref !== void 0;
-    }
-    function He(e) {
-      if (Z.call(e, "key")) {
-        var r = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (r && r.isReactWarning)
-          return !1;
-      }
-      return e.key !== void 0;
-    }
-    function Xe(e, r) {
-      typeof e.ref == "string" && Se.current;
-    }
-    function Ze(e, r) {
-      {
-        var t = function() {
-          Te || (Te = !0, d("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
-        };
-        t.isReactWarning = !0, Object.defineProperty(e, "key", {
-          get: t,
-          configurable: !0
-        });
-      }
-    }
-    function Qe(e, r) {
-      {
-        var t = function() {
-          we || (we = !0, d("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
-        };
-        t.isReactWarning = !0, Object.defineProperty(e, "ref", {
-          get: t,
-          configurable: !0
-        });
-      }
-    }
-    var er = function(e, r, t, n, u, v, l) {
-      var i = {
-        // This tag allows us to uniquely identify this as a React Element
-        $$typeof: c,
-        // Built-in properties that belong on the element
-        type: e,
-        key: r,
-        ref: t,
-        props: l,
-        // Record the component responsible for creating this element.
-        _owner: v
-      };
-      return i._store = {}, Object.defineProperty(i._store, "validated", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !0,
-        value: !1
-      }), Object.defineProperty(i, "_self", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !1,
-        value: n
-      }), Object.defineProperty(i, "_source", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !1,
-        value: u
-      }), Object.freeze && (Object.freeze(i.props), Object.freeze(i)), i;
-    };
-    function rr(e, r, t, n, u) {
-      {
-        var v, l = {}, i = null, T = null;
-        t !== void 0 && (xe(t), i = "" + t), He(r) && (xe(r.key), i = "" + r.key), Ge(r) && (T = r.ref, Xe(r, u));
-        for (v in r)
-          Z.call(r, v) && !qe.hasOwnProperty(v) && (l[v] = r[v]);
-        if (e && e.defaultProps) {
-          var g = e.defaultProps;
-          for (v in g)
-            l[v] === void 0 && (l[v] = g[v]);
-        }
-        if (i || T) {
-          var R = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
-          i && Ze(l, R), T && Qe(l, R);
-        }
-        return er(e, i, T, u, n, Se.current, l);
-      }
-    }
-    var de = k.ReactCurrentOwner, Pe = k.ReactDebugCurrentFrame;
-    function G(e) {
-      if (e) {
-        var r = e._owner, t = ne(e.type, e._source, r ? r.type : null);
-        Pe.setExtraStackFrame(t);
-      } else
-        Pe.setExtraStackFrame(null);
-    }
-    var ve;
-    ve = !1;
-    function pe(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === c;
-    }
-    function Ce() {
-      {
-        if (de.current) {
-          var e = I(de.current.type);
-          if (e)
-            return `
-
-Check the render method of \`` + e + "`.";
-        }
-        return "";
-      }
-    }
-    function tr(e) {
-      return "";
-    }
-    var Oe = {};
-    function nr(e) {
-      {
-        var r = Ce();
-        if (!r) {
-          var t = typeof e == "string" ? e : e.displayName || e.name;
-          t && (r = `
-
-Check the top-level render call using <` + t + ">.");
-        }
-        return r;
-      }
-    }
-    function ke(e, r) {
-      {
-        if (!e._store || e._store.validated || e.key != null)
-          return;
-        e._store.validated = !0;
-        var t = nr(r);
-        if (Oe[t])
-          return;
-        Oe[t] = !0;
-        var n = "";
-        e && e._owner && e._owner !== de.current && (n = " It was passed a child from " + I(e._owner.type) + "."), G(e), d('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, n), G(null);
-      }
-    }
-    function je(e, r) {
-      {
-        if (typeof e != "object")
-          return;
-        if (fe(e))
-          for (var t = 0; t < e.length; t++) {
-            var n = e[t];
-            pe(n) && ke(n, r);
-          }
-        else if (pe(e))
-          e._store && (e._store.validated = !0);
-        else if (e) {
-          var u = C(e);
-          if (typeof u == "function" && u !== e.entries)
-            for (var v = u.call(e), l; !(l = v.next()).done; )
-              pe(l.value) && ke(l.value, r);
-        }
-      }
-    }
-    function ar(e) {
-      {
-        var r = e.type;
-        if (r == null || typeof r == "string")
-          return;
-        var t;
-        if (typeof r == "function")
-          t = r.propTypes;
-        else if (typeof r == "object" && (r.$$typeof === h || // Note: Memo only checks outer props here.
-        // Inner props are checked in the reconciler.
-        r.$$typeof === a))
-          t = r.propTypes;
-        else
-          return;
-        if (t) {
-          var n = I(r);
-          Be(t, e.props, "prop", n, e);
-        } else if (r.PropTypes !== void 0 && !ve) {
-          ve = !0;
-          var u = I(r);
-          d("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", u || "Unknown");
-        }
-        typeof r.getDefaultProps == "function" && !r.getDefaultProps.isReactClassApproved && d("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
-      }
-    }
-    function or(e) {
-      {
-        for (var r = Object.keys(e.props), t = 0; t < r.length; t++) {
-          var n = r[t];
-          if (n !== "children" && n !== "key") {
-            G(e), d("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", n), G(null);
-            break;
-          }
-        }
-        e.ref !== null && (G(e), d("Invalid attribute `ref` supplied to `React.Fragment`."), G(null));
-      }
-    }
-    var Ae = {};
-    function De(e, r, t, n, u, v) {
-      {
-        var l = ie(e);
-        if (!l) {
-          var i = "";
-          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (i += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var T = tr();
-          T ? i += T : i += Ce();
-          var g;
-          e === null ? g = "null" : fe(e) ? g = "array" : e !== void 0 && e.$$typeof === c ? (g = "<" + (I(e.type) || "Unknown") + " />", i = " Did you accidentally export a JSX literal instead of a component?") : g = typeof e, d("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", g, i);
-        }
-        var R = rr(e, r, t, u, v);
-        if (R == null)
-          return R;
-        if (l) {
-          var A = r.children;
-          if (A !== void 0)
-            if (n)
-              if (fe(A)) {
-                for (var H = 0; H < A.length; H++)
-                  je(A[H], e);
-                Object.freeze && Object.freeze(A);
-              } else
-                d("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
-            else
-              je(A, e);
-        }
-        if (Z.call(r, "key")) {
-          var q = I(e), P = Object.keys(r).filter(function(fr) {
-            return fr !== "key";
-          }), ye = P.length > 0 ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!Ae[q + ye]) {
-            var cr = P.length > 0 ? "{" + P.join(": ..., ") + ": ...}" : "{}";
-            d(`A props object containing a "key" prop is being spread into JSX:
-  let props = %s;
-  <%s {...props} />
-React keys must be passed directly to JSX without using spread:
-  let props = %s;
-  <%s key={someKey} {...props} />`, ye, q, cr, q), Ae[q + ye] = !0;
-          }
-        }
-        return e === x ? or(R) : ar(R), R;
-      }
-    }
-    function ir(e, r, t) {
-      return De(e, r, t, !0);
-    }
-    function lr(e, r, t) {
-      return De(e, r, t, !1);
-    }
-    var sr = lr, ur = ir;
-    ee.Fragment = x, ee.jsx = sr, ee.jsxs = ur;
-  })()), ee;
-}
-var Me;
-function yr() {
-  return Me || (Me = 1, process.env.NODE_ENV === "production" ? oe.exports = vr() : oe.exports = pr()), oe.exports;
-}
-var hr = yr();
-function br(_, c) {
-  const E = Math.PI, x = () => this._context, o = this.props, f = this._score, b = () => this.state, m = (p) => {
-    this.setState(p);
+import { jsx as G } from "react/jsx-runtime";
+import { useState as K, useRef as g, useEffect as H } from "react";
+function U(s, r) {
+  const i = Math.PI, x = () => this._context, t = this.props, n = this._score, o = () => this.state, u = (a) => {
+    this.setState(a);
   }, h = Math.random();
   return {
-    serve(p) {
-      const s = 0.1 * E * (1 - 2 * h);
-      m((a) => ({
-        ...a,
-        ballx: p === 1 ? a.playerx + o.paddleWidth : a.aix - o.ballSize,
-        bally: (o.height - o.ballSize) * h,
-        velx: a.ballSpeed * Math.cos(s) * p,
-        vely: a.ballSpeed * Math.sin(s)
+    serve(a) {
+      const c = 0.1 * i * (1 - 2 * h);
+      u((e) => ({
+        ...e,
+        ballx: a === 1 ? e.playerx + t.paddleWidth : e.aix - t.ballSize,
+        bally: (t.height - t.ballSize) * h,
+        velx: e.ballSpeed * Math.cos(c) * a,
+        vely: e.ballSpeed * Math.sin(c)
       }));
     },
     update() {
-      const p = _(), s = c(), a = b(), O = a.ballx, S = a.bally, N = a.velx, L = a.vely;
-      if (m((d) => ({
+      const a = s(), c = r(), e = o(), P = e.ballx, f = e.bally, _ = e.velx, T = e.vely;
+      if (u((d) => ({
         ...d,
-        ballx: O + N,
-        bally: S + L
-      })), 0 > S || S + o.ballSize > o.height) {
-        const d = a.vely < 0 ? 0 - a.bally : o.height - (a.bally + o.ballSize);
-        m((D) => ({
-          ...D,
-          bally: S + 2 * d,
-          vely: L * -1
+        ballx: P + _,
+        bally: f + T
+      })), 0 > f || f + t.ballSize > t.height) {
+        const d = e.vely < 0 ? 0 - e.bally : t.height - (e.bally + t.ballSize);
+        u((S) => ({
+          ...S,
+          bally: f + 2 * d,
+          vely: T * -1
         }));
       }
-      const C = a.velx < 0 ? p : s;
-      if (((d, D, U, z, F, w, J, K) => d < F + J && D < w + K && F < d + U && w < D + z)(
-        C.position().x,
-        C.position().y,
-        o.paddleWidth,
-        o.paddleHeight,
-        a.ballx,
-        a.bally,
-        o.ballSize,
-        o.ballSize
+      const y = e.velx < 0 ? a : c;
+      if (((d, S, R, z, b, p, k, I) => d < b + k && S < p + I && b < d + R && p < S + z)(
+        y.position().x,
+        y.position().y,
+        t.paddleWidth,
+        t.paddleHeight,
+        e.ballx,
+        e.bally,
+        t.ballSize,
+        t.ballSize
       )) {
-        const d = a.velx < 0 ? 1 : -1, D = (a.bally + o.ballSize - C.position().y) / (o.paddleHeight + o.ballSize), U = (D > 0.5 ? -1 : 1) * d, z = 0.25 * E * (2 * D + d) + h, F = Math.abs(z) > 0.2 * E ? 1.1 : 1;
-        m((w) => ({
-          ...w,
-          ballx: C === p ? w.playerx + o.paddleWidth : w.aix - o.ballSize,
-          velx: F * -1 * w.velx,
-          vely: F * U * w.velx * Math.sin(z)
+        const d = e.velx < 0 ? 1 : -1, S = (e.bally + t.ballSize - y.position().y) / (t.paddleHeight + t.ballSize), R = (S > 0.5 ? -1 : 1) * d, z = 0.25 * i * (2 * S + d) + h, b = Math.abs(z) > 0.2 * i ? 1.1 : 1;
+        u((p) => ({
+          ...p,
+          ballx: y === a ? p.playerx + t.paddleWidth : p.aix - t.ballSize,
+          velx: b * -1 * p.velx,
+          vely: b * R * p.velx * Math.sin(z)
         }));
       }
-      (0 > a.ballx + o.ballSize || a.ballx > o.width) && (f(C.name()), this.serve(C.name() === p.name() ? 1 : -1));
+      (0 > e.ballx + t.ballSize || e.ballx > t.width) && (n(y.name()), this.serve(y.name() === a.name() ? 1 : -1));
     },
     draw() {
-      const p = x();
-      if (!p) return;
-      const s = b();
-      p.beginPath(), p.arc(s.ballx, s.bally, o.ballSize, 0, 2 * Math.PI), p.fill(), p.lineWidth = 0, p.strokeStyle = "#fff", p.stroke();
+      const a = x();
+      if (!a) return;
+      const c = o();
+      a.beginPath(), a.arc(c.ballx, c.bally, t.ballSize, 0, 2 * Math.PI), a.fill(), a.lineWidth = 0, a.strokeStyle = "#fff", a.stroke();
     }
   };
 }
-function gr() {
-  const _ = () => this._context, c = this.props, E = this._keystate, x = () => this.state, o = (f) => {
-    this.setState(f);
+function j() {
+  const s = () => this._context, r = this.props, i = this._keystate, x = () => this.state, t = (n) => {
+    this.setState(n);
   };
   return {
     update() {
-      const f = x();
-      let b = f.playery;
-      E[c.upArrow] && (b = f.playery - c.paddleSpeed), E[c.downArrow] && (b = f.playery + c.paddleSpeed), b = Math.max(Math.min(b, c.height - c.paddleHeight), 0), o((m) => ({ ...m, playery: b }));
+      const n = x();
+      let o = n.playery;
+      i[r.upArrow] && (o = n.playery - r.paddleSpeed), i[r.downArrow] && (o = n.playery + r.paddleSpeed), o = Math.max(Math.min(o, r.height - r.paddleHeight), 0), t((u) => ({ ...u, playery: o }));
     },
     draw() {
-      const f = _();
-      if (!f) return;
-      const b = x();
-      f.fillRect(b.playerx, b.playery, c.paddleWidth, c.paddleHeight);
+      const n = s();
+      if (!n) return;
+      const o = x();
+      n.fillRect(o.playerx, o.playery, r.paddleWidth, r.paddleHeight);
     },
     name() {
       return "player";
     },
-    position(f) {
-      f !== void 0 && o((m) => ({ ...m, playery: f }));
-      const b = x();
+    position(n) {
+      n !== void 0 && t((u) => ({ ...u, playery: n }));
+      const o = x();
       return {
-        x: b.playerx,
-        y: b.playery
+        x: o.playerx,
+        y: o.playery
       };
     }
   };
 }
-function mr() {
-  const _ = () => this._context, c = this.props, E = () => this.state, x = (o) => {
-    this.setState(o);
+function q() {
+  const s = () => this._context, r = this.props, i = () => this.state, x = (t) => {
+    this.setState(t);
   };
   return {
     update() {
-      const o = E();
-      let f = o.aiy;
-      const b = o.bally - (c.paddleHeight - c.ballSize) * 0.5;
-      f = f + (b - f) * 0.1, x((m) => ({ ...m, aiy: f }));
+      const t = i();
+      let n = t.aiy;
+      const o = t.bally - (r.paddleHeight - r.ballSize) * 0.5;
+      n = n + (o - n) * 0.1, x((u) => ({ ...u, aiy: n }));
     },
     draw() {
-      const o = _();
-      if (!o) return;
-      const f = E();
-      o.fillRect(f.aix, f.aiy, c.paddleWidth, c.paddleHeight);
+      const t = s();
+      if (!t) return;
+      const n = i();
+      t.fillRect(n.aix, n.aiy, r.paddleWidth, r.paddleHeight);
     },
     name() {
       return "ai";
     },
     position() {
-      const o = E();
+      const t = i();
       return {
-        x: o.aix,
-        y: o.aiy
+        x: t.aix,
+        y: t.aiy
       };
     }
   };
 }
-const _r = ({
-  height: _ = 600,
-  width: c = 700,
-  upArrow: E = "ArrowUp",
+const N = ({
+  height: s = 600,
+  width: r = 700,
+  upArrow: i = "ArrowUp",
   downArrow: x = "ArrowDown",
-  paddleHeight: o = 100,
-  paddleWidth: f = 20,
-  paddleSpeed: b = 5,
-  ballSize: m = 10
+  paddleHeight: t = 100,
+  paddleWidth: n = 20,
+  paddleSpeed: o = 5,
+  ballSize: u = 10
 }) => {
-  const [h, p] = dr({
+  const [h, a] = K({
     ballx: 100,
     bally: 100,
     ballSpeed: 2,
@@ -766,9 +138,9 @@ const _r = ({
     playery: 100,
     playerScore: 0,
     aiScore: 0
-  }), s = B(null), a = B(null), O = B({}), S = B(null), N = B(h), L = B(null), C = B(null), k = B(null);
-  Fe(() => {
-    N.current = h;
+  }), c = g(null), e = g(null), P = g({}), f = g(null), _ = g(h), T = g(null), y = g(null), M = g(null);
+  H(() => {
+    _.current = h;
   }, [h]);
   const d = {
     display: "block",
@@ -778,97 +150,97 @@ const _r = ({
     bottom: "0",
     left: "0",
     right: "0"
-  }, D = { height: _, width: c, upArrow: E, downArrow: x, paddleHeight: o, paddleWidth: f, paddleSpeed: b, ballSize: m }, U = () => {
-    s.current && (a.current = s.current.getContext("2d"));
-  }, z = (y) => {
-    const j = y === "player" ? "ai" : "player", Y = j + "Score";
-    p((W) => ({
-      ...W,
-      [Y]: W[Y] + 1
-    })), X(), setTimeout(() => {
-      a.current && (a.current.font = "30px Arial", a.current.fillStyle = "#fff", a.current.fillText(
-        j + " score!",
-        c / 2,
-        _ / 2
-      ), a.current.restore());
+  }, S = { height: s, width: r, upArrow: i, downArrow: x, paddleHeight: t, paddleWidth: n, paddleSpeed: o, ballSize: u }, R = () => {
+    c.current && (e.current = c.current.getContext("2d"));
+  }, z = (l) => {
+    const m = l === "player" ? "ai" : "player", A = m + "Score";
+    a((v) => ({
+      ...v,
+      [A]: v[A] + 1
+    })), W(), setTimeout(() => {
+      e.current && (e.current.font = "30px Arial", e.current.fillStyle = "#fff", e.current.fillText(
+        m + " score!",
+        r / 2,
+        s / 2
+      ), e.current.restore());
     }, 0), setTimeout(() => {
-      U(), I();
+      R(), B();
     }, 1e3);
-  }, F = () => ({
+  }, b = () => ({
     get _context() {
-      return a.current;
+      return e.current;
     },
     get state() {
-      return N.current;
+      return _.current;
     },
-    props: D,
-    _keystate: O.current,
-    setState: (y) => {
-      p(y);
+    props: S,
+    _keystate: P.current,
+    setState: (l) => {
+      a(l);
     },
     _score: z
   });
-  C.current || (C.current = gr.call(F())), k.current || (k.current = mr.call(F())), L.current || (L.current = br.call(
-    F(),
-    () => C.current,
-    () => k.current
+  y.current || (y.current = j.call(b())), M.current || (M.current = q.call(b())), T.current || (T.current = U.call(
+    b(),
+    () => y.current,
+    () => M.current
   ));
-  const w = L.current, J = C.current, K = k.current, ie = () => {
-    if (!a.current) return;
-    const y = a.current;
-    y.fillStyle = "#000", y.fillRect(0, 0, c, _), y.save(), y.fillStyle = "#fff", y.font = "10px Arial", y.fillText("Player: " + String(h.playerScore), 10, 10), y.fillText("CPU: " + String(h.aiScore), 500, 10), w.draw(), J.draw(), K.draw();
-    const j = 4, Y = (c - j) * 0.5;
-    let W = 0;
-    const V = _ / 20;
-    for (; W < _; )
-      y.fillRect(Y, W + V * 0.25, j, V * 0.5), W += V;
-    y.restore();
-  }, le = () => {
-    J.update(), K.update(), w.update();
-  }, X = () => {
-    S.current !== null && (clearInterval(S.current), S.current = null), setTimeout(() => {
-      a.current && s.current && a.current.clearRect(0, 0, s.current.width, s.current.height);
+  const p = T.current, k = y.current, I = M.current, D = () => {
+    if (!e.current) return;
+    const l = e.current;
+    l.fillStyle = "#000", l.fillRect(0, 0, r, s), l.save(), l.fillStyle = "#fff", l.font = "10px Arial", l.fillText("Player: " + String(h.playerScore), 10, 10), l.fillText("CPU: " + String(h.aiScore), 500, 10), p.draw(), k.draw(), I.draw();
+    const m = 4, A = (r - m) * 0.5;
+    let v = 0;
+    const C = s / 20;
+    for (; v < s; )
+      l.fillRect(A, v + C * 0.25, m, C * 0.5), v += C;
+    l.restore();
+  }, L = () => {
+    k.update(), I.update(), p.update();
+  }, W = () => {
+    f.current !== null && (clearInterval(f.current), f.current = null), setTimeout(() => {
+      e.current && c.current && e.current.clearRect(0, 0, c.current.width, c.current.height);
     }, 0);
-  }, I = () => {
-    if (S.current)
+  }, B = () => {
+    if (f.current)
       return;
-    const y = O.current, j = ($) => {
-      y[$.code] = !0;
-    }, Y = ($) => {
-      y[$.code] = !1;
-    }, W = ($) => {
-      $.preventDefault();
-    }, V = ($) => {
-      $.preventDefault();
+    const l = P.current, m = (w) => {
+      l[w.code] = !0;
+    }, A = (w) => {
+      l[w.code] = !1;
+    }, v = (w) => {
+      w.preventDefault();
+    }, C = (w) => {
+      w.preventDefault();
     };
-    document.addEventListener("keydown", j), document.addEventListener("keyup", Y), document.addEventListener("touchstart", W, !1), document.addEventListener("touchmove", V, !1), S.current = window.setInterval(() => {
-      le(), ie();
-    }, 1), w.serve(1);
-  }, M = (y) => {
-    if (s.current) {
-      const j = y.touches[0].pageY - s.current.offsetTop - o / 2;
-      J.position(j);
+    document.addEventListener("keydown", m), document.addEventListener("keyup", A), document.addEventListener("touchstart", v, !1), document.addEventListener("touchmove", C, !1), f.current = window.setInterval(() => {
+      L(), D();
+    }, 1), p.serve(1);
+  }, E = (l) => {
+    if (c.current) {
+      const m = l.touches[0].pageY - c.current.offsetTop - t / 2;
+      k.position(m);
     }
   };
-  return Fe(() => {
-    U(), a.current && (a.current.font = "30px Arial", a.current.fillText("Starting Game", c / 2, _ / 2));
-    const y = setTimeout(I, 1e3);
+  return H(() => {
+    R(), e.current && (e.current.font = "30px Arial", e.current.fillText("Starting Game", r / 2, s / 2));
+    const l = setTimeout(B, 1e3);
     return () => {
-      clearTimeout(y), X();
+      clearTimeout(l), W();
     };
-  }, []), /* @__PURE__ */ hr.jsx(
+  }, []), /* @__PURE__ */ G(
     "canvas",
     {
-      ref: s,
-      onTouchStart: M,
-      onTouchMove: M,
+      ref: c,
+      onTouchStart: E,
+      onTouchMove: E,
       style: d,
-      width: c,
-      height: _
+      width: r,
+      height: s
     }
   );
 };
 export {
-  _r as Pong,
-  _r as default
+  N as Pong,
+  N as default
 };

package/dist/react-pong.umd.js

@@ -1,30 +1 @@
-(function(z,_){typeof exports=="object"&&typeof module<"u"?_(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],_):(z=typeof globalThis<"u"?globalThis:z||self,_(z.ReactPong={},z.React))})(this,(function(z,_){"use strict";var te={exports:{}},$={};/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */var be;function Le(){if(be)return $;be=1;var E=_,c=Symbol.for("react.element"),x=Symbol.for("react.fragment"),S=Object.prototype.hasOwnProperty,o=E.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,f={key:!0,ref:!0,__self:!0,__source:!0};function b(R,h,p){var l,a={},j=null,T=null;p!==void 0&&(j=""+p),h.key!==void 0&&(j=""+h.key),h.ref!==void 0&&(T=h.ref);for(l in h)S.call(h,l)&&!f.hasOwnProperty(l)&&(a[l]=h[l]);if(R&&R.defaultProps)for(l in h=R.defaultProps,h)a[l]===void 0&&(a[l]=h[l]);return{$$typeof:c,type:R,key:j,ref:T,props:a,_owner:o.current}}return $.Fragment=x,$.jsx=b,$.jsxs=b,$}var q={};/**
- * @license React
- * react-jsx-runtime.development.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */var ge;function Ue(){return ge||(ge=1,process.env.NODE_ENV!=="production"&&(function(){var E=_,c=Symbol.for("react.element"),x=Symbol.for("react.portal"),S=Symbol.for("react.fragment"),o=Symbol.for("react.strict_mode"),f=Symbol.for("react.profiler"),b=Symbol.for("react.provider"),R=Symbol.for("react.context"),h=Symbol.for("react.forward_ref"),p=Symbol.for("react.suspense"),l=Symbol.for("react.suspense_list"),a=Symbol.for("react.memo"),j=Symbol.for("react.lazy"),T=Symbol.for("react.offscreen"),K=Symbol.iterator,V="@@iterator";function O(e){if(e===null||typeof e!="object")return null;var r=K&&e[K]||e[V];return typeof r=="function"?r:null}var k=E.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function d(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];F("error",e,t)}}function F(e,r,t){{var n=k.ReactDebugCurrentFrame,u=n.getStackAddendum();u!==""&&(r+="%s",t=t.concat([u]));var v=t.map(function(s){return String(s)});v.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,v)}}var B=!1,N=!1,I=!1,P=!1,G=!1,H;H=Symbol.for("react.module.reference");function se(e){return!!(typeof e=="string"||typeof e=="function"||e===S||e===f||G||e===o||e===p||e===l||P||e===T||B||N||I||typeof e=="object"&&e!==null&&(e.$$typeof===j||e.$$typeof===a||e.$$typeof===b||e.$$typeof===R||e.$$typeof===h||e.$$typeof===H||e.getModuleId!==void 0))}function le(e,r,t){var n=e.displayName;if(n)return n;var u=r.displayName||r.name||"";return u!==""?t+"("+u+")":t}function ee(e){return e.displayName||"Context"}function M(e){if(e==null)return null;if(typeof e.tag=="number"&&d("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case S:return"Fragment";case x:return"Portal";case f:return"Profiler";case o:return"StrictMode";case p:return"Suspense";case l:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case R:var r=e;return ee(r)+".Consumer";case b:var t=e;return ee(t._context)+".Provider";case h:return le(e,e.render,"ForwardRef");case a:var n=e.displayName||null;return n!==null?n:M(e.type)||"Memo";case j:{var u=e,v=u._payload,s=u._init;try{return M(s(v))}catch{return null}}}return null}var Y=Object.assign,y=0,A,U,W,J,L,_e,Ee;function xe(){}xe.__reactDisabledLog=!0;function Ke(){{if(y===0){A=console.log,U=console.info,W=console.warn,J=console.error,L=console.group,_e=console.groupCollapsed,Ee=console.groupEnd;var e={configurable:!0,enumerable:!0,value:xe,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}y++}}function Ge(){{if(y--,y===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:Y({},e,{value:A}),info:Y({},e,{value:U}),warn:Y({},e,{value:W}),error:Y({},e,{value:J}),group:Y({},e,{value:L}),groupCollapsed:Y({},e,{value:_e}),groupEnd:Y({},e,{value:Ee})})}y<0&&d("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var ue=k.ReactCurrentDispatcher,ce;function ne(e,r,t){{if(ce===void 0)try{throw Error()}catch(u){var n=u.stack.trim().match(/\n( *(at )?)/);ce=n&&n[1]||""}return`
-`+ce+e}}var fe=!1,ae;{var He=typeof WeakMap=="function"?WeakMap:Map;ae=new He}function Se(e,r){if(!e||fe)return"";{var t=ae.get(e);if(t!==void 0)return t}var n;fe=!0;var u=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var v;v=ue.current,ue.current=null,Ke();try{if(r){var s=function(){throw Error()};if(Object.defineProperty(s.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(s,[])}catch(C){n=C}Reflect.construct(e,[],s)}else{try{s.call()}catch(C){n=C}e.call(s.prototype)}}else{try{throw Error()}catch(C){n=C}e()}}catch(C){if(C&&n&&typeof C.stack=="string"){for(var i=C.stack.split(`
-`),w=n.stack.split(`
-`),g=i.length-1,m=w.length-1;g>=1&&m>=0&&i[g]!==w[m];)m--;for(;g>=1&&m>=0;g--,m--)if(i[g]!==w[m]){if(g!==1||m!==1)do if(g--,m--,m<0||i[g]!==w[m]){var D=`
-`+i[g].replace(" at new "," at ");return e.displayName&&D.includes("<anonymous>")&&(D=D.replace("<anonymous>",e.displayName)),typeof e=="function"&&ae.set(e,D),D}while(g>=1&&m>=0);break}}}finally{fe=!1,ue.current=v,Ge(),Error.prepareStackTrace=u}var Q=e?e.displayName||e.name:"",X=Q?ne(Q):"";return typeof e=="function"&&ae.set(e,X),X}function Xe(e,r,t){return Se(e,!1)}function Ze(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function oe(e,r,t){if(e==null)return"";if(typeof e=="function")return Se(e,Ze(e));if(typeof e=="string")return ne(e);switch(e){case p:return ne("Suspense");case l:return ne("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case h:return Xe(e.render);case a:return oe(e.type,r,t);case j:{var n=e,u=n._payload,v=n._init;try{return oe(v(u),r,t)}catch{}}}return""}var re=Object.prototype.hasOwnProperty,Te={},we=k.ReactDebugCurrentFrame;function ie(e){if(e){var r=e._owner,t=oe(e.type,e._source,r?r.type:null);we.setExtraStackFrame(t)}else we.setExtraStackFrame(null)}function Qe(e,r,t,n,u){{var v=Function.call.bind(re);for(var s in e)if(v(e,s)){var i=void 0;try{if(typeof e[s]!="function"){var w=Error((n||"React class")+": "+t+" type `"+s+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[s]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw w.name="Invariant Violation",w}i=e[s](r,s,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(g){i=g}i&&!(i instanceof Error)&&(ie(u),d("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",t,s,typeof i),ie(null)),i instanceof Error&&!(i.message in Te)&&(Te[i.message]=!0,ie(u),d("Failed %s type: %s",t,i.message),ie(null))}}}var $e=Array.isArray;function de(e){return $e(e)}function qe(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function er(e){try{return Pe(e),!1}catch{return!0}}function Pe(e){return""+e}function Ce(e){if(er(e))return d("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",qe(e)),Pe(e)}var Oe=k.ReactCurrentOwner,rr={key:!0,ref:!0,__self:!0,__source:!0},je,ke;function tr(e){if(re.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function nr(e){if(re.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function ar(e,r){typeof e.ref=="string"&&Oe.current}function or(e,r){{var t=function(){je||(je=!0,d("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function ir(e,r){{var t=function(){ke||(ke=!0,d("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var sr=function(e,r,t,n,u,v,s){var i={$$typeof:c,type:e,key:r,ref:t,props:s,_owner:v};return i._store={},Object.defineProperty(i._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(i,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(i,"_source",{configurable:!1,enumerable:!1,writable:!1,value:u}),Object.freeze&&(Object.freeze(i.props),Object.freeze(i)),i};function lr(e,r,t,n,u){{var v,s={},i=null,w=null;t!==void 0&&(Ce(t),i=""+t),nr(r)&&(Ce(r.key),i=""+r.key),tr(r)&&(w=r.ref,ar(r,u));for(v in r)re.call(r,v)&&!rr.hasOwnProperty(v)&&(s[v]=r[v]);if(e&&e.defaultProps){var g=e.defaultProps;for(v in g)s[v]===void 0&&(s[v]=g[v])}if(i||w){var m=typeof e=="function"?e.displayName||e.name||"Unknown":e;i&&or(s,m),w&&ir(s,m)}return sr(e,i,w,u,n,Oe.current,s)}}var ve=k.ReactCurrentOwner,Ae=k.ReactDebugCurrentFrame;function Z(e){if(e){var r=e._owner,t=oe(e.type,e._source,r?r.type:null);Ae.setExtraStackFrame(t)}else Ae.setExtraStackFrame(null)}var pe;pe=!1;function ye(e){return typeof e=="object"&&e!==null&&e.$$typeof===c}function De(){{if(ve.current){var e=M(ve.current.type);if(e)return`
-
-Check the render method of \``+e+"`."}return""}}function ur(e){return""}var Fe={};function cr(e){{var r=De();if(!r){var t=typeof e=="string"?e:e.displayName||e.name;t&&(r=`
-
-Check the top-level render call using <`+t+">.")}return r}}function Ie(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=cr(r);if(Fe[t])return;Fe[t]=!0;var n="";e&&e._owner&&e._owner!==ve.current&&(n=" It was passed a child from "+M(e._owner.type)+"."),Z(e),d('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),Z(null)}}function Me(e,r){{if(typeof e!="object")return;if(de(e))for(var t=0;t<e.length;t++){var n=e[t];ye(n)&&Ie(n,r)}else if(ye(e))e._store&&(e._store.validated=!0);else if(e){var u=O(e);if(typeof u=="function"&&u!==e.entries)for(var v=u.call(e),s;!(s=v.next()).done;)ye(s.value)&&Ie(s.value,r)}}}function fr(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===h||r.$$typeof===a))t=r.propTypes;else return;if(t){var n=M(r);Qe(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!pe){pe=!0;var u=M(r);d("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",u||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&d("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function dr(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){Z(e),d("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),Z(null);break}}e.ref!==null&&(Z(e),d("Invalid attribute `ref` supplied to `React.Fragment`."),Z(null))}}var We={};function Ye(e,r,t,n,u,v){{var s=se(e);if(!s){var i="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(i+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var w=ur();w?i+=w:i+=De();var g;e===null?g="null":de(e)?g="array":e!==void 0&&e.$$typeof===c?(g="<"+(M(e.type)||"Unknown")+" />",i=" Did you accidentally export a JSX literal instead of a component?"):g=typeof e,d("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",g,i)}var m=lr(e,r,t,u,v);if(m==null)return m;if(s){var D=r.children;if(D!==void 0)if(n)if(de(D)){for(var Q=0;Q<D.length;Q++)Me(D[Q],e);Object.freeze&&Object.freeze(D)}else d("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Me(D,e)}if(re.call(r,"key")){var X=M(e),C=Object.keys(r).filter(function(gr){return gr!=="key"}),he=C.length>0?"{key: someKey, "+C.join(": ..., ")+": ...}":"{key: someKey}";if(!We[X+he]){var br=C.length>0?"{"+C.join(": ..., ")+": ...}":"{}";d(`A props object containing a "key" prop is being spread into JSX:
-  let props = %s;
-  <%s {...props} />
-React keys must be passed directly to JSX without using spread:
-  let props = %s;
-  <%s key={someKey} {...props} />`,he,X,br,X),We[X+he]=!0}}return e===S?dr(m):fr(m),m}}function vr(e,r,t){return Ye(e,r,t,!0)}function pr(e,r,t){return Ye(e,r,t,!1)}var yr=pr,hr=vr;q.Fragment=S,q.jsx=yr,q.jsxs=hr})()),q}var Re;function ze(){return Re||(Re=1,process.env.NODE_ENV==="production"?te.exports=Le():te.exports=Ue()),te.exports}var Ve=ze();function Be(E,c){const x=Math.PI,S=()=>this._context,o=this.props,f=this._score,b=()=>this.state,R=p=>{this.setState(p)},h=Math.random();return{serve(p){const l=.1*x*(1-2*h);R(a=>({...a,ballx:p===1?a.playerx+o.paddleWidth:a.aix-o.ballSize,bally:(o.height-o.ballSize)*h,velx:a.ballSpeed*Math.cos(l)*p,vely:a.ballSpeed*Math.sin(l)}))},update(){const p=E(),l=c(),a=b(),j=a.ballx,T=a.bally,K=a.velx,V=a.vely;if(R(d=>({...d,ballx:j+K,bally:T+V})),0>T||T+o.ballSize>o.height){const d=a.vely<0?0-a.bally:o.height-(a.bally+o.ballSize);R(F=>({...F,bally:T+2*d,vely:V*-1}))}const O=a.velx<0?p:l;if(((d,F,B,N,I,P,G,H)=>d<I+G&&F<P+H&&I<d+B&&P<F+N)(O.position().x,O.position().y,o.paddleWidth,o.paddleHeight,a.ballx,a.bally,o.ballSize,o.ballSize)){const d=a.velx<0?1:-1,F=(a.bally+o.ballSize-O.position().y)/(o.paddleHeight+o.ballSize),B=(F>.5?-1:1)*d,N=.25*x*(2*F+d)+h,I=Math.abs(N)>.2*x?1.1:1;R(P=>({...P,ballx:O===p?P.playerx+o.paddleWidth:P.aix-o.ballSize,velx:I*-1*P.velx,vely:I*B*P.velx*Math.sin(N)}))}(0>a.ballx+o.ballSize||a.ballx>o.width)&&(f(O.name()),this.serve(O.name()===p.name()?1:-1))},draw(){const p=S();if(!p)return;const l=b();p.beginPath(),p.arc(l.ballx,l.bally,o.ballSize,0,2*Math.PI),p.fill(),p.lineWidth=0,p.strokeStyle="#fff",p.stroke()}}}function Ne(){const E=()=>this._context,c=this.props,x=this._keystate,S=()=>this.state,o=f=>{this.setState(f)};return{update(){const f=S();let b=f.playery;x[c.upArrow]&&(b=f.playery-c.paddleSpeed),x[c.downArrow]&&(b=f.playery+c.paddleSpeed),b=Math.max(Math.min(b,c.height-c.paddleHeight),0),o(R=>({...R,playery:b}))},draw(){const f=E();if(!f)return;const b=S();f.fillRect(b.playerx,b.playery,c.paddleWidth,c.paddleHeight)},name(){return"player"},position(f){f!==void 0&&o(R=>({...R,playery:f}));const b=S();return{x:b.playerx,y:b.playery}}}}function Je(){const E=()=>this._context,c=this.props,x=()=>this.state,S=o=>{this.setState(o)};return{update(){const o=x();let f=o.aiy;const b=o.bally-(c.paddleHeight-c.ballSize)*.5;f=f+(b-f)*.1,S(R=>({...R,aiy:f}))},draw(){const o=E();if(!o)return;const f=x();o.fillRect(f.aix,f.aiy,c.paddleWidth,c.paddleHeight)},name(){return"ai"},position(){const o=x();return{x:o.aix,y:o.aiy}}}}const me=({height:E=600,width:c=700,upArrow:x="ArrowUp",downArrow:S="ArrowDown",paddleHeight:o=100,paddleWidth:f=20,paddleSpeed:b=5,ballSize:R=10})=>{const[h,p]=_.useState({ballx:100,bally:100,ballSpeed:2,velx:0,vely:0,aix:670,aiy:100,playerx:10,playery:100,playerScore:0,aiScore:0}),l=_.useRef(null),a=_.useRef(null),j=_.useRef({}),T=_.useRef(null),K=_.useRef(h),V=_.useRef(null),O=_.useRef(null),k=_.useRef(null);_.useEffect(()=>{K.current=h},[h]);const d={display:"block",position:"absolute",margin:"auto",top:"0",bottom:"0",left:"0",right:"0"},F={height:E,width:c,upArrow:x,downArrow:S,paddleHeight:o,paddleWidth:f,paddleSpeed:b,ballSize:R},B=()=>{l.current&&(a.current=l.current.getContext("2d"))},N=y=>{const A=y==="player"?"ai":"player",U=A+"Score";p(W=>({...W,[U]:W[U]+1})),ee(),setTimeout(()=>{a.current&&(a.current.font="30px Arial",a.current.fillStyle="#fff",a.current.fillText(A+" score!",c/2,E/2),a.current.restore())},0),setTimeout(()=>{B(),M()},1e3)},I=()=>({get _context(){return a.current},get state(){return K.current},props:F,_keystate:j.current,setState:y=>{p(y)},_score:N});O.current||(O.current=Ne.call(I())),k.current||(k.current=Je.call(I())),V.current||(V.current=Be.call(I(),()=>O.current,()=>k.current));const P=V.current,G=O.current,H=k.current,se=()=>{if(!a.current)return;const y=a.current;y.fillStyle="#000",y.fillRect(0,0,c,E),y.save(),y.fillStyle="#fff",y.font="10px Arial",y.fillText("Player: "+String(h.playerScore),10,10),y.fillText("CPU: "+String(h.aiScore),500,10),P.draw(),G.draw(),H.draw();const A=4,U=(c-A)*.5;let W=0;const J=E/20;for(;W<E;)y.fillRect(U,W+J*.25,A,J*.5),W+=J;y.restore()},le=()=>{G.update(),H.update(),P.update()},ee=()=>{T.current!==null&&(clearInterval(T.current),T.current=null),setTimeout(()=>{a.current&&l.current&&a.current.clearRect(0,0,l.current.width,l.current.height)},0)},M=()=>{if(T.current)return;const y=j.current,A=L=>{y[L.code]=!0},U=L=>{y[L.code]=!1},W=L=>{L.preventDefault()},J=L=>{L.preventDefault()};document.addEventListener("keydown",A),document.addEventListener("keyup",U),document.addEventListener("touchstart",W,!1),document.addEventListener("touchmove",J,!1),T.current=window.setInterval(()=>{le(),se()},1),P.serve(1)},Y=y=>{if(l.current){const A=y.touches[0].pageY-l.current.offsetTop-o/2;G.position(A)}};return _.useEffect(()=>{B(),a.current&&(a.current.font="30px Arial",a.current.fillText("Starting Game",c/2,E/2));const y=setTimeout(M,1e3);return()=>{clearTimeout(y),ee()}},[]),Ve.jsx("canvas",{ref:l,onTouchStart:Y,onTouchMove:Y,style:d,width:c,height:E})};z.Pong=me,z.default=me,Object.defineProperties(z,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(h,P){typeof exports=="object"&&typeof module<"u"?P(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],P):(h=typeof globalThis<"u"?globalThis:h||self,P(h.ReactPong={},h.React,h.React))})(this,(function(h,P,p){"use strict";function L(c,r){const i=Math.PI,S=()=>this._context,e=this.props,n=this._score,s=()=>this.state,u=o=>{this.setState(o)},b=Math.random();return{serve(o){const a=.1*i*(1-2*b);u(t=>({...t,ballx:o===1?t.playerx+e.paddleWidth:t.aix-e.ballSize,bally:(e.height-e.ballSize)*b,velx:t.ballSpeed*Math.cos(a)*o,vely:t.ballSpeed*Math.sin(a)}))},update(){const o=c(),a=r(),t=s(),I=t.ballx,x=t.bally,E=t.velx,w=t.vely;if(u(y=>({...y,ballx:I+E,bally:x+w})),0>x||x+e.ballSize>e.height){const y=t.vely<0?0-t.bally:e.height-(t.bally+e.ballSize);u(m=>({...m,bally:x+2*y,vely:w*-1}))}const d=t.velx<0?o:a;if(((y,m,M,z,v,f,_,W)=>y<v+_&&m<f+W&&v<y+M&&f<m+z)(d.position().x,d.position().y,e.paddleWidth,e.paddleHeight,t.ballx,t.bally,e.ballSize,e.ballSize)){const y=t.velx<0?1:-1,m=(t.bally+e.ballSize-d.position().y)/(e.paddleHeight+e.ballSize),M=(m>.5?-1:1)*y,z=.25*i*(2*m+y)+b,v=Math.abs(z)>.2*i?1.1:1;u(f=>({...f,ballx:d===o?f.playerx+e.paddleWidth:f.aix-e.ballSize,velx:v*-1*f.velx,vely:v*M*f.velx*Math.sin(z)}))}(0>t.ballx+e.ballSize||t.ballx>e.width)&&(n(d.name()),this.serve(d.name()===o.name()?1:-1))},draw(){const o=S();if(!o)return;const a=s();o.beginPath(),o.arc(a.ballx,a.bally,e.ballSize,0,2*Math.PI),o.fill(),o.lineWidth=0,o.strokeStyle="#fff",o.stroke()}}}function G(){const c=()=>this._context,r=this.props,i=this._keystate,S=()=>this.state,e=n=>{this.setState(n)};return{update(){const n=S();let s=n.playery;i[r.upArrow]&&(s=n.playery-r.paddleSpeed),i[r.downArrow]&&(s=n.playery+r.paddleSpeed),s=Math.max(Math.min(s,r.height-r.paddleHeight),0),e(u=>({...u,playery:s}))},draw(){const n=c();if(!n)return;const s=S();n.fillRect(s.playerx,s.playery,r.paddleWidth,r.paddleHeight)},name(){return"player"},position(n){n!==void 0&&e(u=>({...u,playery:n}));const s=S();return{x:s.playerx,y:s.playery}}}}function K(){const c=()=>this._context,r=this.props,i=()=>this.state,S=e=>{this.setState(e)};return{update(){const e=i();let n=e.aiy;const s=e.bally-(r.paddleHeight-r.ballSize)*.5;n=n+(s-n)*.1,S(u=>({...u,aiy:n}))},draw(){const e=c();if(!e)return;const n=i();e.fillRect(n.aix,n.aiy,r.paddleWidth,r.paddleHeight)},name(){return"ai"},position(){const e=i();return{x:e.aix,y:e.aiy}}}}const j=({height:c=600,width:r=700,upArrow:i="ArrowUp",downArrow:S="ArrowDown",paddleHeight:e=100,paddleWidth:n=20,paddleSpeed:s=5,ballSize:u=10})=>{const[b,o]=p.useState({ballx:100,bally:100,ballSpeed:2,velx:0,vely:0,aix:670,aiy:100,playerx:10,playery:100,playerScore:0,aiScore:0}),a=p.useRef(null),t=p.useRef(null),I=p.useRef({}),x=p.useRef(null),E=p.useRef(b),w=p.useRef(null),d=p.useRef(null),k=p.useRef(null);p.useEffect(()=>{E.current=b},[b]);const y={display:"block",position:"absolute",margin:"auto",top:"0",bottom:"0",left:"0",right:"0"},m={height:c,width:r,upArrow:i,downArrow:S,paddleHeight:e,paddleWidth:n,paddleSpeed:s,ballSize:u},M=()=>{a.current&&(t.current=a.current.getContext("2d"))},z=l=>{const g=l==="player"?"ai":"player",A=g+"Score";o(R=>({...R,[A]:R[A]+1})),B(),setTimeout(()=>{t.current&&(t.current.font="30px Arial",t.current.fillStyle="#fff",t.current.fillText(g+" score!",r/2,c/2),t.current.restore())},0),setTimeout(()=>{M(),H()},1e3)},v=()=>({get _context(){return t.current},get state(){return E.current},props:m,_keystate:I.current,setState:l=>{o(l)},_score:z});d.current||(d.current=G.call(v())),k.current||(k.current=K.call(v())),w.current||(w.current=L.call(v(),()=>d.current,()=>k.current));const f=w.current,_=d.current,W=k.current,U=()=>{if(!t.current)return;const l=t.current;l.fillStyle="#000",l.fillRect(0,0,r,c),l.save(),l.fillStyle="#fff",l.font="10px Arial",l.fillText("Player: "+String(b.playerScore),10,10),l.fillText("CPU: "+String(b.aiScore),500,10),f.draw(),_.draw(),W.draw();const g=4,A=(r-g)*.5;let R=0;const C=c/20;for(;R<c;)l.fillRect(A,R+C*.25,g,C*.5),R+=C;l.restore()},q=()=>{_.update(),W.update(),f.update()},B=()=>{x.current!==null&&(clearInterval(x.current),x.current=null),setTimeout(()=>{t.current&&a.current&&t.current.clearRect(0,0,a.current.width,a.current.height)},0)},H=()=>{if(x.current)return;const l=I.current,g=T=>{l[T.code]=!0},A=T=>{l[T.code]=!1},R=T=>{T.preventDefault()},C=T=>{T.preventDefault()};document.addEventListener("keydown",g),document.addEventListener("keyup",A),document.addEventListener("touchstart",R,!1),document.addEventListener("touchmove",C,!1),x.current=window.setInterval(()=>{q(),U()},1),f.serve(1)},D=l=>{if(a.current){const g=l.touches[0].pageY-a.current.offsetTop-e/2;_.position(g)}};return p.useEffect(()=>{M(),t.current&&(t.current.font="30px Arial",t.current.fillText("Starting Game",r/2,c/2));const l=setTimeout(H,1e3);return()=>{clearTimeout(l),B()}},[]),P.jsx("canvas",{ref:a,onTouchStart:D,onTouchMove:D,style:y,width:r,height:c})};h.Pong=j,h.default=j,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alexium216/react-pong",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "A React 18 ping pong game component built with TypeScript",
   "main": "./dist/react-pong.umd.js",
   "module": "./dist/react-pong.es.js",