@realsee/five 6.0.0-alpha.7 → 6.0.0-alpha.71

package/react/index.mjs

@@ -0,0 +1,1365 @@
+/**
+ * @license
+ * @realsee/five
+ * Generated: 12/20/2023
+ * Version: 6.0.0-alpha.71
+ * Terms:
+ * Realsee SDK License Agreement
+ * Update: July 28, 2021
+ * THIS LICENSE AGREEMENT BETWEEN YOU AND 【BEIKE REALSEE TECHNOLOGY (HK) 
+ * LIMITED】(“Realsee”) FORMS A LEGALLY BINDING CONTRACT BETWEEN YOU AND REALSEE IN 
+ * RELATION TO YOUR USE OF THE SDK. This License Agreement accompanies the Realsee 
+ * Software Development Kit(s) for the software and related explanatory materials 
+ * (the "SDK") and includes any upgrades, modified versions, updates, additions, 
+ * and copies of the SDK licensed to You by Realsee.
+ * BY DOWNLOADING, INSTALLING, OR OTHERWISE ACCESSING OR USING THE SDK, YOU AGREE 
+ * THAT YOU HAVE READ, UNDERSTOOD, AND AGREE TO BE BOUND BY THIS AGREEMENT. YOU ARE 
+ * AGREEING ON YOUR OWN BEHALF AND/OR ON BEHALF OF YOUR COMPANY OR ORGANIZATION TO 
+ * THE TERMS AND CONDITIONS STATED BELOW.
+ * This Agreement applies to Your use of the SDK in the country in which You 
+ * legally install it (“Territory”) and is subject to the laws of such Territory 
+ * and further subject to Section 12 below. Different terms, conditions, and 
+ * limitations may apply to the use of the SDK in any additional countries.
+ * 1. DEFINITIONS.
+ * “Agreement” means this Realsee SDK License Agreement.
+ * “Developer”, “You” and “Your” means the person(s) or entity acquiring or using 
+ * the SDK or otherwise exercising rights under the terms of this Agreement.
+ * “Documentation” means the technical or other specifications or documentation 
+ * that Realsee may provide to You for use in connection with the SDK.
+ * “Integrated Product” means any software, website, or on-line service developed 
+ * by You based on or using the SDK (collectively, the “Integrated Product”).
+ * “Intellectual Property” means any patents, patent rights, trademarks, service 
+ * marks, registered and unregistered designs, applications for any of the 
+ * foregoing, copyright, and any other similar protected rights in any country and 
+ * to the extent recognised by any relevant jurisdiction as intellectual property, 
+ * trade secrets, know-how and confidential information. Realsee reserves all 
+ * rights not expressly granted to You.
+ * “Realsee” means [Beike Realsee Technology (HK) Limited, a company incorporated 
+ * and validly existing under the laws of Hong Kong].
+ * “SDK” means the Realsee-proprietary Software Development Kits (SDK) provided 
+ * hereunder, includes all development tools (including any compiler and debugger), 
+ * application programming interfaces (“APIs”), libraries, binary utilities, header 
+ * files, Documentation, content, data, code samples, and other materials provided 
+ * to You in connection with this Agreement, whether delivered through a download, 
+ * or any other media or form, and is licensed, not sold, to You by Realsee for use 
+ * only under the terms of this Agreement. The terms of this Agreement will govern 
+ * any updates provided by Realsee that replace and/or supplement the original SDK 
+ * delivered to You, unless such update is accompanied by a separate license, in 
+ * which case the terms of such license will govern.
+ * 2. LICENSED USES AND RESTRICTIONS.
+ * 2.1 Subject to the restrictions contained in this Section 2, Realsee grants to 
+ * You during the term, a limited, non-exclusive, revocable, non-sublicensable, 
+ * non-transferable license to install and use the SDK within the Territory only 
+ * for the purpose of internal development.
+ * 2.2 Restrictions. You acknowledge and agree that, You shall not, and shall 
+ * ensure that Your affiliates, employees, agents, representatives, officers, 
+ * representatives, and subcontractors do not (directly or indirectly):
+ * 2.2.1 decompile, reverse engineer, disassemble or attempt to derive the source 
+ * code of, those components of the SDK provided in object code form, or any part 
+ * thereof;
+ * 2.2.2 remove, alter, or obscure any copyright notice or other proprietary rights 
+ * notice on any part of the SDK;
+ * 2.2.3 sell, assign, pledge, rent, lease, lend, upload to or host on any website 
+ * or server for use by any third party except You, redistribute, or sublicense the 
+ * SDK (or any part thereof), or operate the SDK (or any part thereof) in the 
+ * capacity of a service bureau or other hosted services provider, in whole or in 
+ * part, nor may You enable others to do so;
+ * 2.2.4 or alter, modify, customize or improve the SDK, or any part thereof;
+ * 2.2.5 use the SDK (or any part thereof) for any illegal purpose, in any manner 
+ * that is inconsistent with the terms of this Agreement, or to engage in any 
+ * illegal activity;
+ * 2.2.6 use the SDK (or any part thereof) in any manner that may damage the 
+ * operation of Realsee’s products or services; or
+ * 2.2.7 use the SDK or any information contained therein or otherwise provided by 
+ * Realsee for the purpose of developing, or having developed, any product 
+ * competitive with any Realsee product or service, as determined by Realsee in its 
+ * sole discretion;
+ * 2.2.8 include any portion of the SDK in Your Developer products.
+ * 2.3 Realsee has the right to impose reasonable conditions such as a reasonable 
+ * fee for use of the SDK in Integrated Product in the future.
+ * 2.4 You may make a limited number of copies of the SDK to be used by Your 
+ * employees or consultants as provided herein, and not for general business 
+ * purposes, and such employees or consultants shall be subject to the obligations 
+ * and restrictions in this Agreement.
+ * 2.5 All licenses not expressly granted in this Agreement are reserved and no 
+ * other licenses, immunity, or rights, express or implied, are granted by Realsee, 
+ * by implication, estoppel, or otherwise.
+ * 3. CONFIDENTIALITY.
+ * The SDK and all source code, Documentation, specifications, engineering details, 
+ * and related information pertaining to the SDK, whether in oral, written, 
+ * graphic, or electronic form, are and shall remain the confidential and 
+ * proprietary information of Realsee or its licensors (collectively, the 
+ * “Confidential Information”). You shall (i) disclose Confidential Information to 
+ * only those directors and employees (collectively, “Affiliates”) whose duties 
+ * justify their need to know such information and who have been clearly informed 
+ * of their obligation to maintain the confidential, proprietary, and/or trade 
+ * secret status of such Confidential Information; and (ii) use Confidential 
+ * Information solely in accordance with the license granted hereunder. In any 
+ * event, You and Your Affiliates shall treat Confidential Information as strictly 
+ * confidential and shall use the same care to prevent disclosure of such 
+ * information as You use with respect to Your own similar confidential and/or 
+ * proprietary information, which shall not be less than the care a reasonable 
+ * person would use under similar circumstances. All Confidential Information, and 
+ * any copies thereof, shall be returned promptly to Realsee upon request. You 
+ * shall ensure that Your Affiliates comply with the provisions of this Section 3, 
+ * and You shall be liable for any breach of this Section 3 resulting from the act 
+ * or omission of any of Your Affiliates. You shall not disclose Confidential 
+ * Information to any third party, including, without limitation, any of Your 
+ * subcontractors.
+ * 4. PROPRIETARY RIGHTS.
+ * 4.1 As between You and Realsee, Realsee and/or its licensors retain ownership of 
+ * all right, title, and interest in, to, and under the SDK, including, without 
+ * limitation, all patents, copyrights, trade secrets, trademarks and other 
+ * intellectual property and other proprietary rights therein, and reserve all 
+ * rights not expressly granted to You.
+ * 4.2 The items contained in the SDK are the intellectual property of Realsee and 
+ * its licensors and are protected by PRC copyright and patent law, international 
+ * treaty provisions and applicable laws of the country in which it is being used. 
+ * You agree to protect all copyright and other ownership interests of Realsee 
+ * and/or its licensors in all items in the SDK supplied under this License 
+ * Agreement. You agree that all copies of the items in the SDK, reproduced for any 
+ * reason by You, contain the same copyright notices, and other proprietary notices 
+ * as appropriate, as appear on or in the original items delivered by Realsee in 
+ * the SDK. Realsee and/or its licensors retain title and ownership of the items in 
+ * the SDK, the media on which it is loaded, and all subsequent copies, regardless 
+ * of the form or media in or on which the original and other copies may exist. 
+ * Except as stated above, this Agreement does not grant You any rights to patents, 
+ * copyrights, trade secrets, trademarks or any other rights in respect to the 
+ * items in the SDK.
+ * 5. TERM AND TERMINATION.
+ * 5.1 This Agreement is effective until terminated. Realsee has the right to 
+ * terminate this Agreement immediately, without judicial intervention, if You fail 
+ * to comply with any term herein. Upon any such termination You must remove all 
+ * full and partial copies of the items in the SDK from Your computer and 
+ * discontinue the use of the items in the SDK.
+ * 5.2 Realsee may at any time, terminate the Agreement with You if: (A) You have 
+ * breached any provision of the Agreement; or (B) Realsee is required to do so by 
+ * law; or (C) Realsee decides to no longer provide the SDK or certain parts of the 
+ * SDK to users in the country in which You are resident or from which You use the 
+ * service, or the provision of the SDK or certain SDK services to You by Realsee 
+ * is, in Realsee's sole discretion, no longer legally or commercially viable.
+ * 5.3 When the Agreement comes to an end, all of the legal rights, obligations and 
+ * liabilities that You and Realsee have benefited from, been subject to (or which 
+ * have accrued over time whilst the Agreement has been in force) or which are 
+ * expressed to continue indefinitely, shall be unaffected by this cessation, and 
+ * the provisions of Section 3, 4, 6, 7 and 8 shall continue to apply to such 
+ * rights, obligations and liabilities indefinitely.
+ * 6. DISCLAIMER OF WARRANTY.
+ * YOU EXPRESSLY ACKNOWLEDGE AND AGREE THAT, TO THE EXTENT PERMITTED BY APPLICABLE 
+ * LAW, USE OF THE SDK (OR ANY PART THEREOF) IS AT YOUR SOLE RISK AND THAT THE 
+ * ENTIRE RISK AS TO SATISFACTORY QUALITY, PERFORMANCE, ACCURACY, AND EFFORT IS 
+ * WITH YOU. REALSEE LICENSES THE SDK TO YOU ONLY ON AN "AS-IS" BASIS. REALSEE 
+ * MAKES NO REPRESENTATION WITH RESPECT TO THE ADEQUACY OF ANY ITEMS IN THE SDK, 
+ * WHETHER OR NOT USED BY YOU IN THE DEVELOPMENT OF INTEGRATED PRODUCT, FOR ANY 
+ * PARTICULAR PURPOSE OR WITH RESPECT TO THEIR ADEQUACY TO PRODUCE ANY PARTICULAR 
+ * RESULT. REALSEE AND ITS LICENSORS SHALL NOT BE LIABLE FOR LOSS OR DAMAGE ARISING 
+ * OUT OF THIS AGREEMENT OR FROM THE DISTRIBUTION OR USE OF INTEGRATED PRODUCT 
+ * CONTAINING PORTIONS OF THE SDK. REALSEE AND ITS LICENSORS DISCLAIM ALL 
+ * WARRANTIES, EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO IMPLIED 
+ * CONDITIONS OR WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE 
+ * OR NONINFRINGEMENT OF ANY THIRD PARTY RIGHT IN RESPECT OF THE ITEMS IN THE SDK 
+ * OR ANY SERVICES RELATED TO THE SDK.
+ * REALSEE IS UNDER NO OBLIGATION TO PROVIDE ANY SUPPORT UNDER THIS LICENSE 
+ * AGREEMENT, INCLUDING UPGRADES OR FUTURE VERSIONS OF THE SDK OR ANY PORTIONS 
+ * THEREOF, TO YOU, END USER OR TO ANY OTHER PARTY.
+ * 7. LIMITATION OF LIABILITY.
+ * TO THE EXTENT NOT PROHIBITED BY APPLICABLE LAW, IN NO EVENT WILL REALSEE OR ITS 
+ * LICENSORS BE LIABLE FOR ANY DIRECT, INCIDENTAL, SPECIAL, INDIRECT, OR 
+ * CONSEQUENTIAL DAMAGES, INCLUDING, WITHOUT LIMITATION, DAMAGES FOR LOSS OF USE, 
+ * LOSS OF BUSINESS, REVENUE, OR PROFITS, LOSS OF OPPORTUNITY (WHETHER DIRECT OR 
+ * INDIRECT), CORRUPTION OR LOSS OF DATA, LOSS OF REPUTATION OR SAVINGS, DOWNTIME, 
+ * OR DAMAGE TO, LOSS OF OR REPLACEMENT OF DATA OR TRANSACTIONS, COST OF 
+ * PROCUREMENT OF SUBSTITUTE SERVICES, BUSINESS INTERRUPTION, OR ANY OTHER 
+ * COMMERCIAL DAMAGES OR LOSSES, ARISING OUT OF OR RELATED TO YOUR USE OR INABILITY 
+ * TO USE THE SDK (OR ANY PART THEREOF), ANY INTEGRATED PRODUCT, OR ANY THIRD PARTY 
+ * SOFTWARE, APPLICATIONS, OR SERVICES IN CONJUNCTION WITH THE SDK (OR ANY PART 
+ * THEREOF), HOWEVER CAUSED, REGARDLESS OF THE THEORY OF LIABILITY (CONTRACT, TORT, 
+ * OR OTHERWISE) AND EVEN IF REALSEE HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH 
+ * DAMAGES. IN NO EVENT WILL REALSEE’S TOTAL LIABILITY TO YOU FOR ALL DAMAGES 
+ * EXCEED ONE HUNDRED DOLLARS ($100.00). THE FOREGOING LIMITATIONS WILL APPLY EVEN 
+ * IF THE ABOVE STATED REMEDY FAILS OF ITS ESSENTIAL PURPOSE. THE LIMITATIONS 
+ * CONTAINED IN SECTIONS 6 AND THIS SECTION 7 ARE A FUNDAMENTAL PART OF THE BASIS 
+ * OF REALSEE’S BARGAIN HEREUNDER, AND REALSEE WOULD NOT ENTER INTO THIS AGREEMENT 
+ * OR PROVIDE YOU WITH ACCESS TO THE SDK ABSENT SUCH LIMITATIONS.
+ * 8. INDEMNIFICATION.
+ * To the extent permitted by applicable law, You agree to indemnify, defend and 
+ * hold harmless Realsee, its affiliates and each of their directors, officers, 
+ * employees, independent contractors, and agents (each a “Realsee Indemnified 
+ * Party”) from any and all claims, losses, liabilities, damages, expenses, and 
+ * costs (including without limitation attorneys’ fees and court costs) incurred by 
+ * a Realsee Indemnified Party as a result of: (i) Your non-compliance with any 
+ * terms of this Agreement; (ii) Your use of the SDK (or any part thereof); or 
+ * (iii) Your use of any Integrated Product, including any claim that Integrated 
+ * Product infringes the copyright, trademark, trade secret or other intellectual 
+ * property right of a third party.
+ * 9. ACKNOWLEDGEMENTS.
+ * Portions of the SDK may utilize or include third party software and other 
+ * copyrighted material. Acknowledgments, licensing terms, and disclaimers for such 
+ * material are contained in Documentation for the SDK or may otherwise accompany 
+ * such material, and Your use of such materials governed by their respective 
+ * terms. In the event of conflict between the terms of this Agreement and an 
+ * applicable open source or third party agreement, the open source or third party 
+ * agreement will control solely with respect to the open source software or third 
+ * party software. Moreover, You shall not subject any items (including not limited 
+ * to source code, object code, and any software)  included in the SDK to any open 
+ * source license.
+ * 10. NON-BLOCKING OF REALSEE DEVELOPMENT.
+ * You acknowledge that Realsee is currently developing or may develop technologies 
+ * and products in the future that have or may have design and/or functionality 
+ * similar to Integrated Product that You may develop based on Your license herein. 
+ * Nothing in this Agreement shall impair, limit or curtail Realsee's right to 
+ * continue with its development, maintenance and/or distribution of Realsee's 
+ * technology or products.
+ * 11. GENERAL.
+ * 11.1 Export Control. You may not use or otherwise export or re-export the SDK 
+ * (or any part thereof) except as authorized by United States law and the laws of 
+ * the jurisdiction(s) in which the SDK (or any part thereof) was obtained. In 
+ * particular, but without limitation, the SDK may not be exported or re-exported 
+ * (i) into any U.S. embargoed countries or (ii) to anyone on the U.S. Treasury 
+ * Department's list of Specially Designated Nationals or the U.S. Department of 
+ * Commerce Denied Person's List or Entity List. By using the SDK (or any part 
+ * thereof), You represent and warrant that You are not located in any such country 
+ * or on any such list.
+ * 11.2 Governing Law. This Agreement and the rights of the parties hereunder shall 
+ * be governed by and construed in accordance with the laws of People’s Republic of 
+ * China (for purpose of this Agreement, excluding Hong Kong, Taiwan, and Macau), 
+ * without reference to its conflict of laws principles. Any dispute, controversy 
+ * or claim arising from or in connection with this Agreement, or the breach, 
+ * termination or invalidity thereof, shall be submitted to China International 
+ * Economic and Trade Arbitration Commission (“CIETAC”) for arbitration in Beijing 
+ * which shall be conducted in accordance with the CIETAC's arbitration rules in 
+ * effect at the time of applying for arbitration. The arbitral award is final and 
+ * binding upon both parties.
+ * 11.3 Severability. If any provision of this Agreement is held by a court of 
+ * competent jurisdiction to be unenforceable for any reason, the remaining 
+ * provisions hereof will be unaffected and remain in full force and effect.
+ * 11.4. Modifications. Realsee reserves the right, from time to time, with or 
+ * without notice to You, to make revisions to this Agreement in our sole and 
+ * absolute discretion.  The most current version of this Agreement will supersede 
+ * all previous versions and shall be made available on the website where the SDK 
+ * is made available, or by such other means as Realsee may determine in its 
+ * discretion. Any modified versions of this Agreement hereto shall take effect 
+ * from the time that it is made available. You shall be responsible for regularly 
+ * checking for notice of any such modifications. You agree that Your continued use 
+ * of the SDK constitutes Your agreement to the modified Agreement.
+ * 11.5 Relationship of the Parties. This Agreement will not be construed as 
+ * creating an agency, partnership, joint venture, fiduciary duty, or any other 
+ * form of legal association between You and Realsee, and You will not represent to 
+ * the contrary, whether expressly, by implication, appearance, or otherwise.
+ * 11.6 Entire Agreement; Governing Language. This Agreement constitutes the entire 
+ * agreement between You and Realsee with respect to the use of the SDK licensed 
+ * hereunder and supersedes all prior understandings regarding such subject matter. 
+ * No amendment to or modification of this Agreement will be binding unless in 
+ * writing and signed by Realsee. You and Realsee hereto confirm that this 
+ * Agreement and all related documents shall be drafted in English.
+*/import * as React from "react";
+import * as THREE from "three";
+import { getViewportScale, Five } from "@realsee/five";
+var extendStatics = function(d, b) {
+  extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d2, b2) {
+    d2.__proto__ = b2;
+  } || function(d2, b2) {
+    for (var p in b2)
+      if (Object.prototype.hasOwnProperty.call(b2, p))
+        d2[p] = b2[p];
+  };
+  return extendStatics(d, b);
+};
+function __extends(d, b) {
+  if (typeof b !== "function" && b !== null)
+    throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+  extendStatics(d, b);
+  function __() {
+    this.constructor = d;
+  }
+  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+}
+var __assign = function() {
+  __assign = Object.assign || function __assign2(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);
+};
+function __spreadArray(to, from, pack) {
+  if (pack || arguments.length === 2)
+    for (var i = 0, l = from.length, ar; i < l; i++) {
+      if (ar || !(i in from)) {
+        if (!ar)
+          ar = Array.prototype.slice.call(from, 0, i);
+        ar[i] = from[i];
+      }
+    }
+  return to.concat(ar || Array.prototype.slice.call(from));
+}
+typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) {
+  var e = new Error(message);
+  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+var webglPool = [];
+var webgl2Pool = [];
+function getRenderer(_a) {
+  var _b = _a === void 0 ? {} : _a, _c = _b.backgroundColor, backgroundColor = _c === void 0 ? 1579548 : _c, _d = _b.backgroundAlpha, backgroundAlpha = _d === void 0 ? 1 : _d, _e = _b.pixelRatio, pixelRatio = _e === void 0 ? 1 : _e, _f = _b.webgl2, webgl2 = _f === void 0 ? false : _f;
+  if (typeof window === "undefined")
+    return;
+  var renderer = null;
+  if (webgl2) {
+    renderer = webglPool.shift();
+  } else {
+    renderer = webgl2Pool.shift();
+  }
+  if (!renderer) {
+    if (webgl2) {
+      var canvas = document.createElement("canvas");
+      var context = canvas.getContext("webgl2");
+      if (context === null) {
+        throw new Error("error occurred when getting webgl2 canvas context");
+      }
+      renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true, canvas, context });
+    } else {
+      renderer = new THREE.WebGLRenderer({ antialias: false, alpha: true });
+    }
+    renderer.outputEncoding = THREE.sRGBEncoding;
+  }
+  renderer.setPixelRatio(pixelRatio);
+  renderer.setClearColor(backgroundColor, backgroundAlpha);
+  renderer.autoClear = true;
+  return renderer;
+}
+function revokeRenderer(renderer) {
+  if (!renderer)
+    return;
+  var webgl2 = renderer.capabilities.isWebGL2;
+  if (webgl2) {
+    if (webgl2Pool.indexOf(renderer) === -1) {
+      webgl2Pool.push(renderer);
+    }
+  } else {
+    if (webglPool.indexOf(renderer) === -1) {
+      webglPool.push(renderer);
+    }
+  }
+}
+var FiveContext = React.createContext(null);
+function useFiveInstance() {
+  var context = React.useContext(FiveContext);
+  if (!context)
+    throw new Error("FiveProvider never found.");
+  return context.five;
+}
+function useFiveWorkLoader() {
+  var context = React.useContext(FiveContext);
+  if (!context)
+    throw new Error("FiveProvider never found.");
+  return context.loadWork;
+}
+function workEqual(work1, work2) {
+  var work1Array = Array.isArray(work1) ? work1 : [work1];
+  var work2Array = Array.isArray(work2) ? work2 : [work2];
+  if (work1Array.length !== work2Array.length) {
+    return false;
+  }
+  for (var i = 0; i < work1Array.length; i++) {
+    if (work1Array[i].workCode !== work2Array[i].workCode) {
+      return false;
+    }
+  }
+  return true;
+}
+function createFiveProvider(fiveInitArgs) {
+  if (fiveInitArgs === void 0) {
+    fiveInitArgs = {};
+  }
+  return (
+    /** @class */
+    function(_super) {
+      __extends(FiveProvider, _super);
+      function FiveProvider() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.unmout = false;
+        return _this;
+      }
+      FiveProvider.prototype.loadWork = function(works, state, duration, userAction) {
+        if (userAction === void 0) {
+          userAction = true;
+        }
+        if (this.props.work) {
+          throw new Error("props 'works' is set in fiveProvider, if you need modify work internal, use 'initialWork' instead.");
+        }
+        return this.five.load(works, state, duration, userAction);
+      };
+      FiveProvider.prototype.shouldComponentUpdate = function(nextProps) {
+        if (this.five && nextProps.work && !workEqual(nextProps.work, this.five.works)) {
+          this.five.load(nextProps.work, nextProps.initialState);
+        }
+        return true;
+      };
+      FiveProvider.prototype.componentWillUnmount = function() {
+        this.unmout = true;
+        if (this.five) {
+          this.five.dispose();
+          revokeRenderer(this.five.renderer);
+          delete this.five;
+        }
+      };
+      FiveProvider.prototype.render = function() {
+        var _this = this;
+        var _a;
+        if (this.unmout) {
+          return null;
+        }
+        if (!this.five) {
+          var viewportScale = getViewportScale();
+          var pixelRatio = viewportScale === 1 ? window.devicePixelRatio : 1;
+          var renderer = getRenderer({
+            pixelRatio,
+            backgroundAlpha: fiveInitArgs.backgroundAlpha,
+            backgroundColor: fiveInitArgs.backgroundColor,
+            webgl2: fiveInitArgs === null || fiveInitArgs === void 0 ? void 0 : fiveInitArgs.webgl2
+          });
+          this.five = new Five(__assign({ renderer }, fiveInitArgs));
+          var inputWork = this.props.work || this.props.initialWork;
+          if (inputWork) {
+            this.five.load(inputWork, this.props.initialState, void 0, (_a = this.props.initialUserAction) !== null && _a !== void 0 ? _a : true);
+          }
+          this.five.on("load", function() {
+            if (_this.props.onWorksChange) {
+              _this.props.onWorksChange(_this.five.works);
+            }
+          });
+          this.five.on("stateChange", function(state, userAction) {
+            if (_this.props.onStateChange) {
+              _this.props.onStateChange(state, userAction);
+            }
+          });
+          this.five.on("currentStateChange", function(state, userAction) {
+            if (_this.props.onCurrentStateChange) {
+              _this.props.onCurrentStateChange(state, userAction);
+            }
+          });
+          this.five.on("error", function(error) {
+            if (_this.props.onError) {
+              _this.props.onError(error);
+            } else {
+              console.warn(error.message);
+            }
+          });
+        }
+        return React.createElement(FiveContext.Provider, {
+          value: {
+            five: this.five,
+            loadWork: function() {
+              var args = [];
+              for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i] = arguments[_i];
+              }
+              return _this.loadWork.apply(_this, args);
+            }
+          }
+        }, this.props.children);
+      };
+      return FiveProvider;
+    }(React.Component)
+  );
+}
+var baseStyle = {
+  display: "inline-block",
+  overflow: "hidden"
+};
+var FiveCanvas = function(_a) {
+  var width = _a.width, height = _a.height;
+  var five = useFiveInstance();
+  var containerRef = React.createRef();
+  var style = __assign({ width, height }, baseStyle);
+  React.useLayoutEffect(function() {
+    if (!containerRef.current)
+      return;
+    if (!five.renderer)
+      return;
+    if (five.renderer.domElement.parentNode !== null && five.renderer.domElement.parentNode !== containerRef.current) {
+      throw new Error("There are more than 2 fiveCanvas in this context.");
+    }
+    if (five.renderer.domElement.parentNode !== containerRef.current) {
+      containerRef.current.appendChild(five.renderer.domElement);
+    }
+    five.camera.aspect = width / height;
+    five.camera.updateProjectionMatrix();
+    five.renderer.setSize(width, height);
+    five.needsRender = true;
+  }, [width, height, containerRef.current]);
+  return React.createElement("div", { ref: containerRef, style });
+};
+function unsafe__useFiveInstance() {
+  return useFiveInstance();
+}
+function useFiveSceneEffect(callback, deps) {
+  var five = useFiveInstance();
+  var dependencyList = [five];
+  if (deps !== void 0) {
+    dependencyList = dependencyList.concat(deps);
+  }
+  React.useLayoutEffect(function() {
+    return callback(five.scene);
+  }, dependencyList);
+}
+var useFiveScene$1 = useFiveSceneEffect;
+function useFiveWork$1() {
+  var five = useFiveInstance();
+  var loadWork = useFiveWorkLoader();
+  var _a = React.useState(function() {
+    return five.works;
+  }), works = _a[0], updateWorks = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("load", function() {
+      return updateWorks(five.works);
+    });
+  }, [five]);
+  return [works, loadWork];
+}
+function getState(five) {
+  return __assign({}, five.state);
+}
+function useFiveState$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return getState(five);
+  }), state = _a[0], updateState = _a[1];
+  var setState = React.useCallback(function(state2, immediately, userAction) {
+    if (immediately === void 0) {
+      immediately = false;
+    }
+    if (userAction === void 0) {
+      userAction = true;
+    }
+    var nextState = typeof state2 === "function" ? state2(five.getCurrentState()) : state2;
+    five.setState(nextState, immediately, userAction);
+  }, [five]);
+  React.useLayoutEffect(function() {
+    return five.on("stateChange", function() {
+      return updateState(getState(five));
+    });
+  }, [five]);
+  return [state, setState];
+}
+function useFiveCurrentState$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return five.getCurrentState();
+  }), currentState = _a[0], updateCurrentState = _a[1];
+  var setState = React.useCallback(function(state, immediately, userAction) {
+    if (immediately === void 0) {
+      immediately = false;
+    }
+    if (userAction === void 0) {
+      userAction = true;
+    }
+    var nextState = typeof state === "function" ? state(five.getCurrentState()) : state;
+    five.setState(nextState, immediately, userAction);
+  }, [five]);
+  React.useLayoutEffect(function() {
+    return five.on("currentStateChange", function() {
+      return updateCurrentState(five.getCurrentState());
+    });
+  }, [five]);
+  return [currentState, setState];
+}
+function useFiveCurrentObserver() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return five.getCurrentState();
+  }), currentState = _a[0], updateCurrentState = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("currentStateChange", function() {
+      return updateCurrentState(five.getCurrentState());
+    });
+  }, [five]);
+  return five.works.getResolvedObserver(currentState);
+}
+function useFiveEventCallback(name, callback, deps) {
+  var five = useFiveInstance();
+  var dependencyList = [five, name];
+  if (deps !== void 0) {
+    dependencyList = dependencyList.concat(deps);
+  }
+  React.useLayoutEffect(function() {
+    return five.on(name, callback);
+  }, dependencyList);
+}
+function useFiveAction() {
+  var five = useFiveInstance();
+  var updateCamera = React.useCallback(function(pose, duration) {
+    return five.updateCamera(pose, duration);
+  }, [five]);
+  var getPixels = React.useCallback(function(x, y, width, height, pixelRatio) {
+    return five.getPixels(x, y, width, height, pixelRatio);
+  }, [five]);
+  var render = React.useCallback(function(callback) {
+    return five.render(callback);
+  }, [five]);
+  var needsRender = React.useCallback(function() {
+    return five.needsRender = true;
+  }, [five]);
+  var preloadPano = React.useCallback(function(pano, callback) {
+    return five.preloadPano(pano, callback);
+  }, [five]);
+  return { updateCamera, getPixels, render, needsRender, preloadPano };
+}
+function useFiveProject2d$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return Symbol();
+  });
+  _a[0];
+  var upadte = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("cameraUpdate", function() {
+      return upadte(Symbol());
+    });
+  }, [five]);
+  var preject2d = React.useCallback(function(vector, testModel) {
+    return five.project2d(vector, testModel);
+  }, [five]);
+  return preject2d;
+}
+function getRaycaster(five) {
+  var direction = five.camera.getWorldDirection(new THREE.Vector3());
+  var raycaster = new THREE.Raycaster(five.camera.position, direction);
+  return raycaster;
+}
+function useFiveCameraRaycaster$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return getRaycaster(five);
+  }), raycaster = _a[0], updateRaycaster = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("cameraUpdate", function() {
+      return updateRaycaster(getRaycaster(five));
+    });
+  }, [five]);
+  return raycaster;
+}
+function getDirection(five) {
+  return five.camera.getWorldDirection(new THREE.Vector3());
+}
+function useFiveCameraDirection$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return getDirection(five);
+  }), direction = _a[0], updateDirection = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("cameraUpdate", function() {
+      return updateDirection(getDirection(five));
+    });
+  }, [five]);
+  return direction;
+}
+function useFiveModelIntersectRaycaster$1() {
+  var five = useFiveInstance();
+  var fiveModelIntersectRaycaster = React.useCallback(function(raycaster) {
+    return five.model.intersectRaycaster(raycaster);
+  }, [five]);
+  return fiveModelIntersectRaycaster;
+}
+function getReadyState(five) {
+  return five.model.empty ? "Empty" : "Loaded";
+}
+function useFiveModelReadyState$1() {
+  var five = useFiveInstance();
+  var _a = React.useState(function() {
+    return getReadyState(five);
+  }), readyState = _a[0], updateReadyState = _a[1];
+  React.useLayoutEffect(function() {
+    return five.on("modelLoaded", function() {
+      return updateReadyState(getReadyState(five));
+    });
+  }, [five]);
+  return readyState;
+}
+function useFiveFloor() {
+  var five = useFiveInstance();
+  var _a = React.useState(five.model.shownFloor), shownFloor = _a[0], updateShownFloor = _a[1];
+  var _b = React.useState(five.model.floorLength), totalFloorLength = _b[0], updateTotalFloorLength = _b[1];
+  var showFloor = React.useCallback(function(floorIndex) {
+    if (typeof floorIndex === "number") {
+      five.model.show(floorIndex);
+    } else {
+      five.model.show();
+    }
+  }, [five]);
+  React.useLayoutEffect(function() {
+    var off = [];
+    off.push(five.on("modelShownFloorChange", function() {
+      return updateShownFloor(five.model.shownFloor);
+    }));
+    off.push(five.on("modelLoaded", function() {
+      return updateTotalFloorLength(five.model.floorLength);
+    }));
+    return function() {
+      var callback;
+      while (callback = off.shift()) {
+        callback();
+      }
+    };
+  }, [five]);
+  return [shownFloor, totalFloorLength, showFloor];
+}
+function useFiveHelper() {
+  var five = useFiveInstance();
+  var _a = React.useState(five.helperVisible), helperVisible = _a[0], updateHelperVisible = _a[1];
+  var toggleHelperVisible = React.useCallback(function(visible) {
+    five.helperVisible = visible;
+  }, [five]);
+  React.useLayoutEffect(function() {
+    return five.on("helpersVisibleChange", function(visible) {
+      return updateHelperVisible(visible);
+    });
+  }, [five]);
+  return [helperVisible, toggleHelperVisible];
+}
+var INJECTION_PROPNAME = "$five";
+function hasFeature(feature, features) {
+  return features.indexOf(feature) >= 0;
+}
+function injectObject(object, assign) {
+  for (var _i = 0, _a = Object.keys(assign); _i < _a.length; _i++) {
+    var name_1 = _a[_i];
+    if (assign[name_1] !== void 0)
+      object[name_1] = assign[name_1];
+  }
+}
+function useFiveState(five, features) {
+  var enable = hasFeature("state", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var state = React.useMemo(function() {
+    if (enable) {
+      return __assign({}, five.state);
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("stateChange", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [state, updated];
+}
+function useFiveCurrentState(five, features) {
+  var enable = hasFeature("currentState", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var currentState = React.useMemo(function() {
+    if (enable) {
+      return five.getCurrentState();
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("currentStateChange", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [currentState, updated];
+}
+function useFivecurrentObserver(five, features) {
+  var enable = hasFeature("currentObserver", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var currentState = React.useMemo(function() {
+    if (enable) {
+      return five.getCurrentState();
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("currentStateChange", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  var observer = void 0;
+  if (currentState) {
+    observer = five.works.getResolvedObserver(currentState);
+  }
+  return [observer, updated];
+}
+function useUnsafe__fiveInstance(five, features) {
+  var enable = hasFeature("unsafe__fiveInstance", features);
+  return [enable ? five : void 0];
+}
+function useFiveWork(five, features) {
+  var enable = hasFeature("works", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var work = React.useMemo(function() {
+    if (enable) {
+      return five.works;
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("load", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [work, updated];
+}
+function useFiveModel(five, features) {
+  var enable = hasFeature("model", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var model = React.useMemo(function() {
+    if (enable) {
+      return five.model;
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("modelLoaded", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [model, updated];
+}
+function useFiveScene(five, features) {
+  var enable = hasFeature("scene", features);
+  return [enable ? five.scene : void 0];
+}
+function useFiveCameraDirection(five, features) {
+  var enable = hasFeature("cameraDirection", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var cameraDirection = React.useMemo(function() {
+    if (enable) {
+      return five.camera.getWorldDirection(new THREE.Vector3());
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("cameraUpdate", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [cameraDirection, updated];
+}
+function useFiveCameraRaycaster(five, features) {
+  var enable = hasFeature("cameraRaycaster", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var cameraRaycaster = React.useMemo(function() {
+    if (enable) {
+      var direction = five.camera.getWorldDirection(new THREE.Vector3());
+      var raycaster = new THREE.Raycaster(five.camera.position, direction);
+      return raycaster;
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("cameraUpdate", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [cameraRaycaster, updated];
+}
+function useFiveModelReadyState(five, features) {
+  var enable = hasFeature("modelReadyState", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var modelReadyState = React.useMemo(function() {
+    if (enable) {
+      return five.model.empty ? "Empty" : "Loaded";
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("modelLoaded", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [modelReadyState, updated];
+}
+function useFiveShownFloor(five, features) {
+  var enable = hasFeature("shownFloor", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var shownFloor = React.useMemo(function() {
+    if (enable) {
+      return five.model.shownFloor;
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("modelShownFloorChange", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [shownFloor, updated];
+}
+function useHelperVisible(five, features) {
+  var enable = hasFeature("helperVisible", features);
+  var _a = React.useState(Symbol()), updated = _a[0], update = _a[1];
+  var helperVisible = React.useMemo(function() {
+    if (enable) {
+      return five.helperVisible;
+    }
+  }, [five, updated]);
+  React.useLayoutEffect(function() {
+    if (enable) {
+      return five.on("helpersVisibleChange", function() {
+        return update(Symbol());
+      });
+    }
+  }, [five]);
+  return [helperVisible, updated];
+}
+function useFiveLoadWork(loadWork, features) {
+  if (hasFeature("loadWork", features)) {
+    return loadWork;
+  }
+}
+function useFiveSetState(five, features) {
+  if (hasFeature("setState", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.setState.apply(five, args);
+    };
+  }
+}
+function useFiveOn(five, features) {
+  if (hasFeature("on", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.on.apply(five, args);
+    };
+  }
+}
+function useFiveOnce(five, features) {
+  if (hasFeature("on", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.once.apply(five, args);
+    };
+  }
+}
+function useFiveOff(five, features) {
+  if (hasFeature("off", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.off.apply(five, args);
+    };
+  }
+}
+function useFiveModelIntersectRaycaster(five, features) {
+  if (hasFeature("intersectRaycaster", features)) {
+    return function() {
+      var _a;
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return (_a = five.model).intersectRaycaster.apply(_a, args);
+    };
+  }
+}
+function useFiveProject2d(five, features) {
+  if (hasFeature("project2d", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.project2d.apply(five, args);
+    };
+  }
+}
+function useFiveUpdateCamera(five, features) {
+  if (hasFeature("updateCamera", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.updateCamera.apply(five, args);
+    };
+  }
+}
+function useFiveGetPixels(five, features) {
+  if (hasFeature("getPixels", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.getPixels.apply(five, args);
+    };
+  }
+}
+function useFiveRender(five, features) {
+  if (hasFeature("render", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.render.apply(five, args);
+    };
+  }
+}
+function useFiveNeedsRender(five, features) {
+  if (hasFeature("needsRender", features)) {
+    return function() {
+      five.needsRender = true;
+    };
+  }
+}
+function useFivePreloadPano(five, features) {
+  if (hasFeature("preloadPano", features)) {
+    return function() {
+      var args = [];
+      for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+      }
+      return five.preloadPano.apply(five, args);
+    };
+  }
+}
+function useFiveShowFloor(five, features) {
+  if (hasFeature("showFloor", features)) {
+    return function(floorIndex) {
+      if (typeof floorIndex === "number") {
+        five.model.show(floorIndex);
+      } else {
+        five.model.show();
+      }
+    };
+  }
+}
+function useFiveToggleHelperVisible(five, features) {
+  if (hasFeature("toggleHelperVisible", features)) {
+    return function(visible) {
+      five.helperVisible = visible;
+    };
+  }
+}
+function withFive(features) {
+  return function(Component) {
+    return React.forwardRef(function(props, ref) {
+      var five = useFiveInstance();
+      var loadWork = useFiveWorkLoader();
+      var unsafe__fiveInstance = useUnsafe__fiveInstance(five, features)[0];
+      var _a = useFiveState(five, features), state = _a[0], stateUpdated = _a[1];
+      var _b = useFiveCurrentState(five, features), currentState = _b[0], currentStateUpdated = _b[1];
+      var _c = useFivecurrentObserver(five, features), currentObserver = _c[0], currentObserverUpdated = _c[1];
+      var _d = useFiveWork(five, features), work = _d[0], workUpdated = _d[1];
+      var _e = useFiveModel(five, features), model = _e[0], modelUpdated = _e[1];
+      var scene = useFiveScene(five, features)[0];
+      var _f = useFiveCameraDirection(five, features), cameraDirection = _f[0], cameraDirectionUpdated = _f[1];
+      var _g = useFiveCameraRaycaster(five, features), cameraRaycaster = _g[0], cameraRaycasterUpdated = _g[1];
+      var _h = useFiveModelReadyState(five, features), modelReadyState = _h[0], modelReadyStateUpdated = _h[1];
+      var _j = useFiveShownFloor(five, features), shownFloor = _j[0], shownFloorUpdated = _j[1];
+      var _k = useHelperVisible(five, features), helperVisible = _k[0], helperVisibleUpdated = _k[1];
+      var actions = React.useMemo(function() {
+        var injection2 = {};
+        injectObject(injection2, {
+          setState: useFiveSetState(five, features),
+          loadWork: useFiveLoadWork(loadWork, features),
+          on: useFiveOn(five, features),
+          once: useFiveOnce(five, features),
+          off: useFiveOff(five, features),
+          intersectRaycaster: useFiveModelIntersectRaycaster(five, features),
+          project2d: useFiveProject2d(five, features),
+          updateCamera: useFiveUpdateCamera(five, features),
+          getPixels: useFiveGetPixels(five, features),
+          render: useFiveRender(five, features),
+          needsRender: useFiveNeedsRender(five, features),
+          preloadPano: useFivePreloadPano(five, features),
+          showFloor: useFiveShowFloor(five, features),
+          toggleHelperVisible: useFiveToggleHelperVisible(five, features)
+        });
+        return injection2;
+      }, [five, loadWork]);
+      var injection = React.useMemo(function() {
+        var injection2 = __assign({}, actions);
+        injectObject(injection2, {
+          unsafe__fiveInstance,
+          state,
+          currentState,
+          currentObserver,
+          work,
+          model,
+          scene,
+          cameraDirection,
+          cameraRaycaster,
+          modelReadyState,
+          shownFloor,
+          helperVisible
+        });
+        return injection2;
+      }, [
+        five,
+        actions,
+        stateUpdated,
+        currentStateUpdated,
+        currentObserverUpdated,
+        workUpdated,
+        modelUpdated,
+        cameraDirectionUpdated,
+        cameraRaycasterUpdated,
+        modelReadyStateUpdated,
+        shownFloorUpdated,
+        helperVisibleUpdated
+      ]);
+      return React.createElement(Component, __assign({ ref, $five: injection }, props));
+    });
+  };
+}
+function createFiveFeature() {
+  var features = [];
+  for (var _i = 0; _i < arguments.length; _i++) {
+    features[_i] = arguments[_i];
+  }
+  return features;
+}
+function pick(obj, keys) {
+  var res = {};
+  var len = keys.length;
+  var idx = -1;
+  while (++idx < len) {
+    var key = keys[idx];
+    if (key in obj) {
+      res[key] = obj[key];
+    }
+  }
+  return res;
+}
+function valueEquals(value1, value2) {
+  if (typeof value1 === "number" && typeof value2 === "number") {
+    if (isNaN(value1) && isNaN(value2))
+      return true;
+  }
+  return value1 === value2;
+}
+function hasSameItemInBothStringArray(array1, array2) {
+  for (var i = 0; i < array1.length; i++) {
+    for (var j = 0; j < array2.length; j++) {
+      if (array1[i] === array2[j])
+        return true;
+    }
+  }
+  return false;
+}
+var Store = (
+  /** @class */
+  function() {
+    function Store2(initialValue, onValuesChange) {
+      this.values = initialValue;
+      this.listeners = [];
+      this.onValuesChange = onValuesChange;
+    }
+    Store2.prototype.on = function(names, callback) {
+      var _this = this;
+      var listener = [names, callback];
+      this.listeners.push(listener);
+      return function() {
+        var index = _this.listeners.indexOf(listener);
+        if (index >= 0) {
+          _this.listeners.splice(index, 1);
+        }
+      };
+    };
+    Store2.prototype.getValues = function(names) {
+      return pick(this.values, names);
+    };
+    Store2.prototype.setValues = function(names, values) {
+      var modifyNames = [];
+      for (var name_1 in values) {
+        if (names.indexOf(name_1) >= 0 && !valueEquals(values[name_1], this.values[name_1])) {
+          modifyNames.push(name_1);
+        }
+      }
+      if (modifyNames.length === 0)
+        return;
+      var prevValue = __assign({}, this.values);
+      for (var _i = 0, modifyNames_1 = modifyNames; _i < modifyNames_1.length; _i++) {
+        var name_2 = modifyNames_1[_i];
+        this.values[name_2] = values[name_2];
+      }
+      if (this.onValuesChange) {
+        this.onValuesChange(this.values, prevValue);
+      }
+      for (var _a = 0, _b = this.listeners; _a < _b.length; _a++) {
+        var _c = _b[_a], names_1 = _c[0], callback = _c[1];
+        if (!hasSameItemInBothStringArray(names_1, modifyNames)) {
+          continue;
+        }
+        var prevValue_ = pick(prevValue, names_1);
+        var nextValue_ = pick(this.values, names_1);
+        callback(nextValue_, prevValue_);
+      }
+    };
+    return Store2;
+  }()
+);
+function createStore(actionHandler) {
+  var StoreContext = React.createContext(null);
+  return {
+    /**
+     * 使用 Store
+     * @param names - 获取的 Store 字段
+     * @returns [值, 修改值方法]
+     */
+    useStore: function(names) {
+      var store = React.useContext(StoreContext);
+      if (store === null) {
+        throw new Error("StoreProvider never found.");
+      }
+      var firstUpdate = React.useRef(true);
+      var _a = React.useState(store.getValues(names)), values = _a[0], setValues_ = _a[1];
+      var dependencyList = __spreadArray([store], names, true);
+      React.useLayoutEffect(function() {
+        if (firstUpdate.current) {
+          firstUpdate.current = false;
+        } else {
+          setValues_(store.getValues(names));
+        }
+        return store.on(names, function(value) {
+          return setValues_(value);
+        });
+      }, dependencyList);
+      var setValues = React.useCallback(function(values2) {
+        return store.setValues(names, values2);
+      }, dependencyList);
+      return [values, setValues];
+    },
+    /**
+     * 使用 Store (仅设置值)
+     * @param names - 获取的 Store 字段
+     * @returns 修改值方法
+     */
+    useStoreSetter: function(names) {
+      var store = React.useContext(StoreContext);
+      if (store === null) {
+        throw new Error("StoreProvider never found.");
+      }
+      var setValues = React.useCallback(function(values) {
+        return store.setValues(names, values);
+      }, __spreadArray([store], names, true));
+      return setValues;
+    },
+    /**
+     * 监听 Store 变化
+     * @param names - Store 字段
+     * @param callback - 监听变化的回调函数
+     * @param deps - 依赖对象
+     */
+    watchStore: function(names, callback, deps) {
+      var store = React.useContext(StoreContext);
+      if (store === null) {
+        throw new Error("StoreProvider never found.");
+      }
+      var dependencyList = __spreadArray([store], names, true);
+      if (deps !== void 0) {
+        dependencyList = dependencyList.concat(deps);
+      }
+      React.useLayoutEffect(function() {
+        return store.on(names, callback);
+      }, dependencyList);
+    },
+    useStoreAction: function(actionName) {
+      var store = React.useContext(StoreContext);
+      if (store === null) {
+        throw new Error("StoreProvider never found.");
+      }
+      var action = React.useCallback(function() {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+          args[_i] = arguments[_i];
+        }
+        var _a = actionHandler[actionName], callback = _a[0], deps = _a.slice(1);
+        var getValues = function() {
+          return store.getValues(deps);
+        };
+        var setValues = function(values) {
+          return store.setValues(deps, values);
+        };
+        return callback.apply(void 0, __spreadArray([getValues, setValues], args, false));
+      }, []);
+      return action;
+    },
+    /**
+     * Store Provider.
+     * 内部组件均可和 store 交互
+     */
+    StoreProvider: (
+      /** @class */
+      function(_super) {
+        __extends(StoreProvider, _super);
+        function StoreProvider(props) {
+          var _this = _super.call(this, props) || this;
+          _this.store = new Store(props.initialValue, function() {
+            var _a;
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+              args[_i] = arguments[_i];
+            }
+            if (_this.props.onValuesChange) {
+              (_a = _this.props).onValuesChange.apply(_a, args);
+            }
+          });
+          return _this;
+        }
+        StoreProvider.prototype.shouldComponentUpdate = function(nextProps) {
+          if (nextProps.children === this.props.children) {
+            return false;
+          }
+          return true;
+        };
+        StoreProvider.prototype.render = function() {
+          return React.createElement(StoreContext.Provider, { value: this.store }, this.props.children);
+        };
+        return StoreProvider;
+      }(React.Component)
+    )
+  };
+}
+export {
+  FiveCanvas,
+  INJECTION_PROPNAME,
+  Store,
+  createFiveFeature,
+  createFiveProvider,
+  createStore,
+  unsafe__useFiveInstance,
+  useFiveAction,
+  useFiveCameraDirection$1 as useFiveCameraDirection,
+  useFiveCameraRaycaster$1 as useFiveCameraRaycaster,
+  useFiveCurrentObserver,
+  useFiveCurrentState$1 as useFiveCurrentState,
+  useFiveEventCallback,
+  useFiveFloor,
+  useFiveHelper,
+  useFiveModelIntersectRaycaster$1 as useFiveModelIntersectRaycaster,
+  useFiveModelReadyState$1 as useFiveModelReadyState,
+  useFiveProject2d$1 as useFiveProject2d,
+  useFiveScene$1 as useFiveScene,
+  useFiveSceneEffect,
+  useFiveState$1 as useFiveState,
+  useFiveWork$1 as useFiveWork,
+  withFive
+};