@streamlayer/react 0.8.2 → 0.8.4

package/lib/esm/index.js

@@ -239,14 +239,6 @@ var init_process = __esm({
   }
 });
 
-// external-global-plugin:react
-var require_react = __commonJS({
-  "external-global-plugin:react"(exports, module) {
-    init_process();
-    module.exports = window.React;
-  }
-});
-
 // node_modules/.pnpm/react-is@16.13.1/node_modules/react-is/cjs/react-is.development.js
 var require_react_is_development = __commonJS({
   "node_modules/.pnpm/react-is@16.13.1/node_modules/react-is/cjs/react-is.development.js"(exports) {
@@ -3858,7 +3850,7 @@ init_process();
 
 // packages/react-ui/src/lib/gamification/inapp/index.tsx
 init_process();
-var import_react = __toESM(require_react(), 1);
+import { useCallback } from "react";
 
 // packages/react-ui/src/assets/icons/icon-exit.svg
 var icon_exit_default = 'data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A  <rect width="24" height="24" rx="12" fill="white" fill-opacity="0.1"/>%0A  <rect x="8.25" y="7" width="12.3744" height="1.76777" rx="0.883884" transform="rotate(45 8.25 7)" fill="white"/>%0A  <rect x="7" y="15.75" width="12.3744" height="1.76777" rx="0.883884" transform="rotate(-45 7 15.75)" fill="white"/>%0A</svg>%0A';
@@ -3942,7 +3934,7 @@ var CloseIcon = styled.img`
 // packages/react-ui/src/lib/gamification/inapp/index.tsx
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
 var InApp = ({ title: title3 = "", icon, color, openVoiting, closeInApp }) => {
-  const _closeInApp = (0, import_react.useCallback)(
+  const _closeInApp = useCallback(
     (e) => {
       e.stopPropagation();
       closeInApp();
@@ -3960,7 +3952,7 @@ var InApp = ({ title: title3 = "", icon, color, openVoiting, closeInApp }) => {
 
 // packages/react-ui/src/lib/gamification/login/index.tsx
 init_process();
-var import_react17 = __toESM(require_react(), 1);
+import { useState } from "react";
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/min/index.js
 init_process();
@@ -3974,22 +3966,22 @@ init_process();
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/PhoneInputWithCountry.js
 init_process();
-var import_react10 = __toESM(require_react(), 1);
 var import_prop_types9 = __toESM(require_prop_types(), 1);
 var import_classnames4 = __toESM(require_classnames(), 1);
+import React8 from "react";
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/InputSmart.js
 init_process();
-var import_react3 = __toESM(require_react(), 1);
 var import_prop_types2 = __toESM(require_prop_types(), 1);
+import React2, { useCallback as useCallback3 } from "react";
 
 // node_modules/.pnpm/input-format@0.3.8/node_modules/input-format/react/index.js
 init_process();
 
 // node_modules/.pnpm/input-format@0.3.8/node_modules/input-format/modules/react/Input.js
 init_process();
-var import_react2 = __toESM(require_react(), 1);
 var import_prop_types = __toESM(require_prop_types(), 1);
+import React, { useCallback as useCallback2, useRef } from "react";
 
 // node_modules/.pnpm/input-format@0.3.8/node_modules/input-format/modules/inputControl.js
 init_process();
@@ -4381,8 +4373,8 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 }
 function Input(_ref, ref) {
   var value = _ref.value, parse3 = _ref.parse, format4 = _ref.format, InputComponent = _ref.inputComponent, onChange2 = _ref.onChange, onKeyDown2 = _ref.onKeyDown, rest = _objectWithoutProperties(_ref, _excluded);
-  var internalRef = (0, import_react2.useRef)();
-  var setRef = (0, import_react2.useCallback)(function(instance) {
+  var internalRef = useRef();
+  var setRef = useCallback2(function(instance) {
     internalRef.current = instance;
     if (ref) {
       if (typeof ref === "function") {
@@ -4392,23 +4384,23 @@ function Input(_ref, ref) {
       }
     }
   }, [ref]);
-  var _onChange = (0, import_react2.useCallback)(function(event) {
+  var _onChange = useCallback2(function(event) {
     return onChange(event, internalRef.current, parse3, format4, onChange2);
   }, [internalRef, parse3, format4, onChange2]);
-  var _onKeyDown = (0, import_react2.useCallback)(function(event) {
+  var _onKeyDown = useCallback2(function(event) {
     if (onKeyDown2) {
       onKeyDown2(event);
     }
     return onKeyDown(event, internalRef.current, parse3, format4, onChange2);
   }, [internalRef, parse3, format4, onChange2, onKeyDown2]);
-  return /* @__PURE__ */ import_react2.default.createElement(InputComponent, _extends({}, rest, {
+  return /* @__PURE__ */ React.createElement(InputComponent, _extends({}, rest, {
     ref: setRef,
     value: format4(isEmptyValue(value) ? "" : value).text,
     onKeyDown: _onKeyDown,
     onChange: _onChange
   }));
 }
-Input = /* @__PURE__ */ import_react2.default.forwardRef(Input);
+Input = /* @__PURE__ */ React.forwardRef(Input);
 Input.propTypes = {
   // Parses a single characher of `<input/>` text.
   parse: import_prop_types.default.func.isRequired,
@@ -8911,7 +8903,7 @@ function _objectWithoutPropertiesLoose2(source, excluded) {
 function createInput(defaultMetadata) {
   function InputSmart(_ref, ref) {
     var country = _ref.country, international = _ref.international, withCountryCallingCode = _ref.withCountryCallingCode, _ref$metadata = _ref.metadata, metadata2 = _ref$metadata === void 0 ? defaultMetadata : _ref$metadata, rest = _objectWithoutProperties2(_ref, _excluded2);
-    var format4 = (0, import_react3.useCallback)(function(value) {
+    var format4 = useCallback3(function(value) {
       var formatter = new AsYouType(country, metadata2);
       var prefix = getInputValuePrefix({
         country,
@@ -8932,13 +8924,13 @@ function createInput(defaultMetadata) {
         template
       };
     }, [country, metadata2]);
-    return /* @__PURE__ */ import_react3.default.createElement(Input_default, _extends2({}, rest, {
+    return /* @__PURE__ */ React2.createElement(Input_default, _extends2({}, rest, {
       ref,
       parse: parsePhoneNumberCharacter,
       format: format4
     }));
   }
-  InputSmart = /* @__PURE__ */ import_react3.default.forwardRef(InputSmart);
+  InputSmart = /* @__PURE__ */ React2.forwardRef(InputSmart);
   InputSmart.propTypes = {
     /**
      * The parsed phone number.
@@ -8993,8 +8985,8 @@ var InputSmart_default = createInput();
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/InputBasic.js
 init_process();
-var import_react5 = __toESM(require_react(), 1);
 var import_prop_types3 = __toESM(require_prop_types(), 1);
+import React3, { useCallback as useCallback4 } from "react";
 var _excluded3 = ["value", "onChange", "country", "international", "withCountryCallingCode", "metadata", "inputComponent"];
 function _extends3() {
   _extends3 = Object.assign ? Object.assign.bind() : function(target) {
@@ -9051,7 +9043,7 @@ function createInput2(defaultMetadata) {
       withCountryCallingCode,
       metadata: metadata2
     });
-    var _onChange = (0, import_react5.useCallback)(function(event) {
+    var _onChange = useCallback4(function(event) {
       var newValue = parseIncompletePhoneNumber(event.target.value);
       if (newValue === value) {
         var newValueFormatted = format2(prefix, newValue, country, metadata2);
@@ -9061,13 +9053,13 @@ function createInput2(defaultMetadata) {
       }
       onChange2(newValue);
     }, [prefix, value, onChange2, country, metadata2]);
-    return /* @__PURE__ */ import_react5.default.createElement(Input2, _extends3({}, rest, {
+    return /* @__PURE__ */ React3.createElement(Input2, _extends3({}, rest, {
       ref,
       value: format2(prefix, value, country, metadata2),
       onChange: _onChange
     }));
   }
-  InputBasic = /* @__PURE__ */ import_react5.default.forwardRef(InputBasic);
+  InputBasic = /* @__PURE__ */ React3.forwardRef(InputBasic);
   InputBasic.propTypes = {
     /**
      * The parsed phone number.
@@ -9129,9 +9121,9 @@ function format2(prefix, value, country, metadata2) {
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/CountrySelect.js
 init_process();
-var import_react6 = __toESM(require_react(), 1);
 var import_prop_types4 = __toESM(require_prop_types(), 1);
 var import_classnames = __toESM(require_classnames(), 1);
+import React4, { useCallback as useCallback5, useMemo } from "react";
 
 // node_modules/.pnpm/country-flag-icons@1.5.7/node_modules/country-flag-icons/unicode/index.js
 init_process();
@@ -9233,19 +9225,19 @@ function _objectWithoutPropertiesLoose4(source, excluded) {
 }
 function CountrySelect(_ref) {
   var value = _ref.value, onChange2 = _ref.onChange, options = _ref.options, rest = _objectWithoutProperties4(_ref, _excluded4);
-  var onChange_ = (0, import_react6.useCallback)(function(event) {
+  var onChange_ = useCallback5(function(event) {
     var value2 = event.target.value;
     onChange2(value2 === "ZZ" ? void 0 : value2);
   }, [onChange2]);
-  var selectedOption = (0, import_react6.useMemo)(function() {
+  var selectedOption = useMemo(function() {
     return getSelectedOption(options, value);
   }, [options, value]);
-  return /* @__PURE__ */ import_react6.default.createElement("select", _extends4({}, rest, {
+  return /* @__PURE__ */ React4.createElement("select", _extends4({}, rest, {
     value: value || "ZZ",
     onChange: onChange_
   }), options.map(function(_ref2) {
     var value2 = _ref2.value, label = _ref2.label, divider = _ref2.divider;
-    return /* @__PURE__ */ import_react6.default.createElement("option", {
+    return /* @__PURE__ */ React4.createElement("option", {
       key: divider ? "|" : value2 || "ZZ",
       value: divider ? "|" : value2 || "ZZ",
       disabled: divider ? true : false,
@@ -9278,23 +9270,23 @@ var DIVIDER_STYLE = {
 };
 function CountrySelectWithIcon(_ref3) {
   var value = _ref3.value, options = _ref3.options, className = _ref3.className, Icon3 = _ref3.iconComponent, getIconAspectRatio = _ref3.getIconAspectRatio, _ref3$arrowComponent = _ref3.arrowComponent, Arrow = _ref3$arrowComponent === void 0 ? DefaultArrowComponent : _ref3$arrowComponent, unicodeFlags = _ref3.unicodeFlags, rest = _objectWithoutProperties4(_ref3, _excluded22);
-  var selectedOption = (0, import_react6.useMemo)(function() {
+  var selectedOption = useMemo(function() {
     return getSelectedOption(options, value);
   }, [options, value]);
-  return /* @__PURE__ */ import_react6.default.createElement("div", {
+  return /* @__PURE__ */ React4.createElement("div", {
     className: "PhoneInputCountry"
-  }, /* @__PURE__ */ import_react6.default.createElement(CountrySelect, _extends4({}, rest, {
+  }, /* @__PURE__ */ React4.createElement(CountrySelect, _extends4({}, rest, {
     value,
     options,
     className: (0, import_classnames.default)("PhoneInputCountrySelect", className)
-  })), unicodeFlags && value && /* @__PURE__ */ import_react6.default.createElement("div", {
+  })), unicodeFlags && value && /* @__PURE__ */ React4.createElement("div", {
     className: "PhoneInputCountryIconUnicode"
-  }, getCountryFlag(value)), !(unicodeFlags && value) && /* @__PURE__ */ import_react6.default.createElement(Icon3, {
+  }, getCountryFlag(value)), !(unicodeFlags && value) && /* @__PURE__ */ React4.createElement(Icon3, {
     "aria-hidden": true,
     country: value,
     label: selectedOption && selectedOption.label,
     aspectRatio: unicodeFlags ? 1 : void 0
-  }), /* @__PURE__ */ import_react6.default.createElement(Arrow, null));
+  }), /* @__PURE__ */ React4.createElement(Arrow, null));
 }
 CountrySelectWithIcon.propTypes = {
   // Country flag component.
@@ -9305,7 +9297,7 @@ CountrySelectWithIcon.propTypes = {
   unicodeFlags: import_prop_types4.default.bool
 };
 function DefaultArrowComponent() {
-  return /* @__PURE__ */ import_react6.default.createElement("div", {
+  return /* @__PURE__ */ React4.createElement("div", {
     className: "PhoneInputCountrySelectArrow"
   });
 }
@@ -9320,9 +9312,9 @@ function getSelectedOption(options, value) {
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/Flag.js
 init_process();
-var import_react7 = __toESM(require_react(), 1);
 var import_prop_types5 = __toESM(require_prop_types(), 1);
 var import_classnames2 = __toESM(require_classnames(), 1);
+import React5 from "react";
 var _excluded5 = ["country", "countryName", "flags", "flagUrl"];
 function _extends5() {
   _extends5 = Object.assign ? Object.assign.bind() : function(target) {
@@ -9377,7 +9369,7 @@ function FlagComponent(_ref) {
       title: countryName
     });
   }
-  return /* @__PURE__ */ import_react7.default.createElement("img", _extends5({}, rest, {
+  return /* @__PURE__ */ React5.createElement("img", _extends5({}, rest, {
     alt: countryName,
     role: countryName ? void 0 : "presentation",
     src: flagUrl.replace("{XX}", country).replace("{xx}", country.toLowerCase())
@@ -9404,8 +9396,8 @@ FlagComponent.propTypes = {
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/InternationalIcon.js
 init_process();
-var import_react8 = __toESM(require_react(), 1);
 var import_prop_types6 = __toESM(require_prop_types(), 1);
+import React6 from "react";
 var _excluded6 = ["aspectRatio"];
 var _excluded23 = ["title"];
 var _excluded32 = ["title"];
@@ -9458,9 +9450,9 @@ function _objectWithoutPropertiesLoose6(source, excluded) {
 function InternationalIcon(_ref) {
   var aspectRatio = _ref.aspectRatio, rest = _objectWithoutProperties6(_ref, _excluded6);
   if (aspectRatio === 1) {
-    return /* @__PURE__ */ import_react8.default.createElement(InternationalIcon1x1, rest);
+    return /* @__PURE__ */ React6.createElement(InternationalIcon1x1, rest);
   } else {
-    return /* @__PURE__ */ import_react8.default.createElement(InternationalIcon3x2, rest);
+    return /* @__PURE__ */ React6.createElement(InternationalIcon3x2, rest);
   }
 }
 InternationalIcon.propTypes = {
@@ -9469,37 +9461,37 @@ InternationalIcon.propTypes = {
 };
 function InternationalIcon3x2(_ref2) {
   var title3 = _ref2.title, rest = _objectWithoutProperties6(_ref2, _excluded23);
-  return /* @__PURE__ */ import_react8.default.createElement("svg", _extends6({}, rest, {
+  return /* @__PURE__ */ React6.createElement("svg", _extends6({}, rest, {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 75 50"
-  }), /* @__PURE__ */ import_react8.default.createElement("title", null, title3), /* @__PURE__ */ import_react8.default.createElement("g", {
+  }), /* @__PURE__ */ React6.createElement("title", null, title3), /* @__PURE__ */ React6.createElement("g", {
     className: "PhoneInputInternationalIconGlobe",
     stroke: "currentColor",
     fill: "none",
     strokeWidth: "2",
     strokeMiterlimit: "10"
-  }, /* @__PURE__ */ import_react8.default.createElement("path", {
+  }, /* @__PURE__ */ React6.createElement("path", {
     strokeLinecap: "round",
     d: "M47.2,36.1C48.1,36,49,36,50,36c7.4,0,14,1.7,18.5,4.3"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     d: "M68.6,9.6C64.2,12.3,57.5,14,50,14c-7.4,0-14-1.7-18.5-4.3"
-  }), /* @__PURE__ */ import_react8.default.createElement("line", {
+  }), /* @__PURE__ */ React6.createElement("line", {
     x1: "26",
     y1: "25",
     x2: "74",
     y2: "25"
-  }), /* @__PURE__ */ import_react8.default.createElement("line", {
+  }), /* @__PURE__ */ React6.createElement("line", {
     x1: "50",
     y1: "1",
     x2: "50",
     y2: "49"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     strokeLinecap: "round",
     d: "M46.3,48.7c1.2,0.2,2.5,0.3,3.7,0.3c13.3,0,24-10.7,24-24S63.3,1,50,1S26,11.7,26,25c0,2,0.3,3.9,0.7,5.8"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     strokeLinecap: "round",
     d: "M46.8,48.2c1,0.6,2.1,0.8,3.2,0.8c6.6,0,12-10.7,12-24S56.6,1,50,1S38,11.7,38,25c0,1.4,0.1,2.7,0.2,4c0,0.1,0,0.2,0,0.2"
-  })), /* @__PURE__ */ import_react8.default.createElement("path", {
+  })), /* @__PURE__ */ React6.createElement("path", {
     className: "PhoneInputInternationalIconPhone",
     stroke: "none",
     fill: "currentColor",
@@ -9511,34 +9503,34 @@ InternationalIcon3x2.propTypes = {
 };
 function InternationalIcon1x1(_ref3) {
   var title3 = _ref3.title, rest = _objectWithoutProperties6(_ref3, _excluded32);
-  return /* @__PURE__ */ import_react8.default.createElement("svg", _extends6({}, rest, {
+  return /* @__PURE__ */ React6.createElement("svg", _extends6({}, rest, {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 50 50"
-  }), /* @__PURE__ */ import_react8.default.createElement("title", null, title3), /* @__PURE__ */ import_react8.default.createElement("g", {
+  }), /* @__PURE__ */ React6.createElement("title", null, title3), /* @__PURE__ */ React6.createElement("g", {
     className: "PhoneInputInternationalIconGlobe",
     stroke: "currentColor",
     fill: "none",
     strokeWidth: "2",
     strokeLinecap: "round"
-  }, /* @__PURE__ */ import_react8.default.createElement("path", {
+  }, /* @__PURE__ */ React6.createElement("path", {
     d: "M8.45,13A21.44,21.44,0,1,1,37.08,41.56"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     d: "M19.36,35.47a36.9,36.9,0,0,1-2.28-13.24C17.08,10.39,21.88.85,27.8.85s10.72,9.54,10.72,21.38c0,6.48-1.44,12.28-3.71,16.21"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     d: "M17.41,33.4A39,39,0,0,1,27.8,32.06c6.62,0,12.55,1.5,16.48,3.86"
-  }), /* @__PURE__ */ import_react8.default.createElement("path", {
+  }), /* @__PURE__ */ React6.createElement("path", {
     d: "M44.29,8.53c-3.93,2.37-9.86,3.88-16.49,3.88S15.25,10.9,11.31,8.54"
-  }), /* @__PURE__ */ import_react8.default.createElement("line", {
+  }), /* @__PURE__ */ React6.createElement("line", {
     x1: "27.8",
     y1: "0.85",
     x2: "27.8",
     y2: "34.61"
-  }), /* @__PURE__ */ import_react8.default.createElement("line", {
+  }), /* @__PURE__ */ React6.createElement("line", {
     x1: "15.2",
     y1: "22.23",
     x2: "49.15",
     y2: "22.23"
-  })), /* @__PURE__ */ import_react8.default.createElement("path", {
+  })), /* @__PURE__ */ React6.createElement("path", {
     className: "PhoneInputInternationalIconPhone",
     stroke: "transparent",
     fill: "currentColor",
@@ -9662,9 +9654,9 @@ function getSupportedCountries(countries, metadata2) {
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/CountryIcon.js
 init_process();
-var import_react9 = __toESM(require_react(), 1);
 var import_prop_types7 = __toESM(require_prop_types(), 1);
 var import_classnames3 = __toESM(require_classnames(), 1);
+import React7 from "react";
 var _excluded7 = ["country", "label", "aspectRatio"];
 function _extends7() {
   _extends7 = Object.assign ? Object.assign.bind() : function(target) {
@@ -9717,18 +9709,18 @@ function createCountryIconComponent(_ref) {
   function CountryIcon(_ref2) {
     var country = _ref2.country, label = _ref2.label, aspectRatio = _ref2.aspectRatio, rest = _objectWithoutProperties7(_ref2, _excluded7);
     var _aspectRatio = InternationalIcon2 === InternationalIcon ? aspectRatio : void 0;
-    return /* @__PURE__ */ import_react9.default.createElement("div", _extends7({}, rest, {
+    return /* @__PURE__ */ React7.createElement("div", _extends7({}, rest, {
       className: (0, import_classnames3.default)("PhoneInputCountryIcon", {
         "PhoneInputCountryIcon--square": _aspectRatio === 1,
         "PhoneInputCountryIcon--border": country
       })
-    }), country ? /* @__PURE__ */ import_react9.default.createElement(FlagComponent2, {
+    }), country ? /* @__PURE__ */ React7.createElement(FlagComponent2, {
       country,
       countryName: label,
       flags,
       flagUrl,
       className: "PhoneInputCountryIconImg"
-    }) : /* @__PURE__ */ import_react9.default.createElement(InternationalIcon2, {
+    }) : /* @__PURE__ */ React7.createElement(InternationalIcon2, {
       title: label,
       aspectRatio: _aspectRatio,
       className: "PhoneInputCountryIconImg"
@@ -10497,7 +10489,7 @@ var PhoneNumberInput_ = /* @__PURE__ */ function(_React$PureComponent) {
         }
       }
     });
-    _this.inputRef = /* @__PURE__ */ import_react10.default.createRef();
+    _this.inputRef = /* @__PURE__ */ React8.createRef();
     var _this$props3 = _this.props, _value = _this$props3.value, labels2 = _this$props3.labels, _international = _this$props3.international, _addInternationalOption = _this$props3.addInternationalOption, displayInitialValueAsLocalNumber = _this$props3.displayInitialValueAsLocalNumber, initialValueFormat = _this$props3.initialValueFormat, _metadata = _this$props3.metadata;
     var _this$props4 = _this.props, _defaultCountry = _this$props4.defaultCountry, _countries = _this$props4.countries;
     if (_defaultCountry) {
@@ -10631,14 +10623,14 @@ var PhoneNumberInput_ = /* @__PURE__ */ function(_React$PureComponent) {
       var countrySelectOptions = this.getCountrySelectOptions({
         countries
       });
-      return /* @__PURE__ */ import_react10.default.createElement(ContainerComponent, {
+      return /* @__PURE__ */ React8.createElement(ContainerComponent, {
         style,
         className: (0, import_classnames4.default)(className, "PhoneInput", {
           "PhoneInput--focus": isFocused,
           "PhoneInput--disabled": disabled,
           "PhoneInput--readOnly": readOnly
         })
-      }, /* @__PURE__ */ import_react10.default.createElement(CountrySelectComponent, _extends8({
+      }, /* @__PURE__ */ React8.createElement(CountrySelectComponent, _extends8({
         name: name ? "".concat(name, "Country") : void 0,
         "aria-label": labels2.country
       }, countrySelectProps, {
@@ -10650,7 +10642,7 @@ var PhoneNumberInput_ = /* @__PURE__ */ function(_React$PureComponent) {
         disabled: disabled || countrySelectProps && countrySelectProps.disabled,
         readOnly: readOnly || countrySelectProps && countrySelectProps.readOnly,
         iconComponent: this.CountryIcon
-      })), /* @__PURE__ */ import_react10.default.createElement(InputComponent, _extends8({
+      })), /* @__PURE__ */ React8.createElement(InputComponent, _extends8({
         ref: this.setInputRef,
         type: "tel",
         autoComplete
@@ -10685,9 +10677,9 @@ var PhoneNumberInput_ = /* @__PURE__ */ function(_React$PureComponent) {
     )
   }]);
   return PhoneNumberInput_2;
-}(import_react10.default.PureComponent);
-var PhoneNumberInput = /* @__PURE__ */ import_react10.default.forwardRef(function(props, ref) {
-  return /* @__PURE__ */ import_react10.default.createElement(PhoneNumberInput_, _extends8({}, withDefaultProps(props), {
+}(React8.PureComponent);
+var PhoneNumberInput = /* @__PURE__ */ React8.forwardRef(function(props, ref) {
+  return /* @__PURE__ */ React8.createElement(PhoneNumberInput_, _extends8({}, withDefaultProps(props), {
     inputRef: ref
   }));
 });
@@ -11157,7 +11149,7 @@ function formatPhoneNumberIntl(value, metadata2) {
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/modules/PhoneInputWithCountryDefault.js
 init_process();
-var import_react11 = __toESM(require_react(), 1);
+import React9 from "react";
 
 // node_modules/.pnpm/react-phone-number-input@3.3.6_react-dom@18.2.0_react@18.2.0/node_modules/react-phone-number-input/locale/en.json.js
 init_process();
@@ -11471,9 +11463,9 @@ function _objectWithoutPropertiesLoose9(source, excluded) {
   return target;
 }
 function createPhoneInput(defaultMetadata) {
-  var PhoneInputDefault = /* @__PURE__ */ import_react11.default.forwardRef(function(_ref, ref) {
+  var PhoneInputDefault = /* @__PURE__ */ React9.forwardRef(function(_ref, ref) {
     var _ref$metadata = _ref.metadata, metadata2 = _ref$metadata === void 0 ? defaultMetadata : _ref$metadata, _ref$labels = _ref.labels, labels2 = _ref$labels === void 0 ? en_json_default : _ref$labels, rest = _objectWithoutProperties9(_ref, _excluded9);
-    return /* @__PURE__ */ import_react11.default.createElement(PhoneInputWithCountry_default, _extends9({}, rest, {
+    return /* @__PURE__ */ React9.createElement(PhoneInputWithCountry_default, _extends9({}, rest, {
       ref,
       metadata: metadata2,
       labels: labels2
@@ -15962,17 +15954,17 @@ var login = async (host, phone, code) => {
 
 // packages/react-ui/src/lib/gamification/vote/components/voting-header/components/timer/index.tsx
 init_process();
-var import_react16 = __toESM(require_react(), 1);
+import { useEffect } from "react";
 
 // node_modules/.pnpm/react-countdown-circle-timer@3.2.1_react@18.2.0/node_modules/react-countdown-circle-timer/lib/index.module.js
 init_process();
-var import_react12 = __toESM(require_react());
-var import_react13 = __toESM(require_react());
-var import_react14 = __toESM(require_react());
-var import_react15 = __toESM(require_react());
-var G = typeof window == "undefined" ? import_react15.useEffect : import_react15.useLayoutEffect;
+import x from "react";
+import { useRef as U } from "react";
+import { useState as E, useRef as b, useCallback as q } from "react";
+import { useEffect as M, useLayoutEffect as L } from "react";
+var G = typeof window == "undefined" ? M : L;
 var I = ({ isPlaying: o, duration: e, startAt: n = 0, updateInterval: t = 0, onComplete: s, onUpdate: r }) => {
-  let [i, c] = (0, import_react14.useState)(n), m = (0, import_react14.useRef)(0), p = (0, import_react14.useRef)(n), f = (0, import_react14.useRef)(n * -1e3), u = (0, import_react14.useRef)(null), a = (0, import_react14.useRef)(null), h = (0, import_react14.useRef)(null), w = (g) => {
+  let [i, c] = E(n), m = b(0), p = b(n), f = b(n * -1e3), u = b(null), a = b(null), h = b(null), w = (g) => {
     let l = g / 1e3;
     if (a.current === null) {
       a.current = l, u.current = requestAnimationFrame(w);
@@ -15984,7 +15976,7 @@ var I = ({ isPlaying: o, duration: e, startAt: n = 0, updateInterval: t = 0, onC
     c(v ? e : k), v || (u.current = requestAnimationFrame(w));
   }, $ = () => {
     u.current && cancelAnimationFrame(u.current), h.current && clearTimeout(h.current), a.current = null;
-  }, y = (0, import_react14.useCallback)((g) => {
+  }, y = q((g) => {
     $(), m.current = 0;
     let l = typeof g == "number" ? g : n;
     p.current = l, c(l), o && (u.current = requestAnimationFrame(w));
@@ -16028,7 +16020,7 @@ var j = (o, e) => {
   return `rgb(${m.map((a, h) => F(i, a, p[h] - a, c, f) | 0).join(",")})`;
 };
 var S = (o) => {
-  let { duration: e, initialRemainingTime: n, updateInterval: t, size: s = 180, strokeWidth: r = 12, trailStrokeWidth: i, isPlaying: c = false, isGrowing: m = false, rotation: p = "clockwise", onComplete: f, onUpdate: u } = o, a = (0, import_react13.useRef)(), h = Math.max(r, i != null ? i : 0), { path: w, pathLength: $ } = A(s, h, p), { elapsedTime: y } = I({ isPlaying: c, duration: e, startAt: T(e, n), updateInterval: t, onUpdate: typeof u == "function" ? (l) => {
+  let { duration: e, initialRemainingTime: n, updateInterval: t, size: s = 180, strokeWidth: r = 12, trailStrokeWidth: i, isPlaying: c = false, isGrowing: m = false, rotation: p = "clockwise", onComplete: f, onUpdate: u } = o, a = U(), h = Math.max(r, i != null ? i : 0), { path: w, pathLength: $ } = A(s, h, p), { elapsedTime: y } = I({ isPlaying: c, duration: e, startAt: T(e, n), updateInterval: t, onUpdate: typeof u == "function" ? (l) => {
     let d = Math.ceil(e - l);
     d !== a.current && (a.current = d, u(d));
   } : void 0, onComplete: typeof f == "function" ? (l) => {
@@ -16041,7 +16033,7 @@ var S = (o) => {
 };
 var D = (o) => {
   let { children: e, strokeLinecap: n, trailColor: t, trailStrokeWidth: s } = o, { path: r, pathLength: i, stroke: c, strokeDashoffset: m, remainingTime: p, elapsedTime: f, size: u, strokeWidth: a } = S(o);
-  return import_react12.default.createElement("div", { style: B(u) }, import_react12.default.createElement("svg", { viewBox: `0 0 ${u} ${u}`, width: u, height: u, xmlns: "http://www.w3.org/2000/svg" }, import_react12.default.createElement("path", { d: r, fill: "none", stroke: t != null ? t : "#d9d9d9", strokeWidth: s != null ? s : a }), import_react12.default.createElement("path", { d: r, fill: "none", stroke: c, strokeLinecap: n != null ? n : "round", strokeWidth: a, strokeDasharray: i, strokeDashoffset: m })), typeof e == "function" && import_react12.default.createElement("div", { style: P }, e({ remainingTime: p, elapsedTime: f, color: c })));
+  return x.createElement("div", { style: B(u) }, x.createElement("svg", { viewBox: `0 0 ${u} ${u}`, width: u, height: u, xmlns: "http://www.w3.org/2000/svg" }, x.createElement("path", { d: r, fill: "none", stroke: t != null ? t : "#d9d9d9", strokeWidth: s != null ? s : a }), x.createElement("path", { d: r, fill: "none", stroke: c, strokeLinecap: n != null ? n : "round", strokeWidth: a, strokeDasharray: i, strokeDashoffset: m })), typeof e == "function" && x.createElement("div", { style: P }, e({ remainingTime: p, elapsedTime: f, color: c })));
 };
 D.displayName = "CountdownCircleTimer";
 
@@ -16100,7 +16092,7 @@ var STROKE_WIDTH = 4;
 var TRAIL_STROKE_WIDTH = 0;
 var Timer = ({ isPlaying = true, duration = DEFAULT_DURATION, setTimeToExpire }) => {
   const renderTime = ({ remainingTime }) => /* @__PURE__ */ jsx2(RemainingTime, { remainingTime, children: remainingTime });
-  (0, import_react16.useEffect)(() => {
+  useEffect(() => {
     setTimeToExpire(false);
   }, [setTimeToExpire]);
   return /* @__PURE__ */ jsx2(
@@ -16191,9 +16183,9 @@ var Digits = styled3.div`
 // packages/react-ui/src/lib/gamification/login/index.tsx
 import { jsx as jsx3, jsxs as jsxs2 } from "@emotion/react/jsx-runtime";
 var Login = ({ login: login2, anonymousLogin, host }) => {
-  const [phoneInput, setPhoneInput] = (0, import_react17.useState)("");
-  const [phone, setPhone] = (0, import_react17.useState)("");
-  const [code, setCode] = (0, import_react17.useState)("");
+  const [phoneInput, setPhoneInput] = useState("");
+  const [phone, setPhone] = useState("");
+  const [code, setCode] = useState("");
   const digits = useDigitInput({
     acceptedCharacters: /^[0-9]$/,
     length: 4,
@@ -20252,7 +20244,7 @@ var UserStatistics = ({
 
 // packages/react-ui/src/lib/gamification/vote/index.tsx
 init_process();
-var import_react18 = __toESM(require_react(), 1);
+import { useState as useState2, useEffect as useEffect2, useCallback as useCallback6 } from "react";
 
 // packages/react-ui/src/assets/icons/icon-check.svg
 var icon_check_default = 'data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<g id="Checkmark">%0A<path id="Selected" fill-rule="evenodd" clip-rule="evenodd" d="M24 12.002C24 18.6294 18.6274 24.002 12 24.002C5.37258 24.002 0 18.6294 0 12.002C0 5.37454 5.37258 0.00195312 12 0.00195312C18.6274 0.00195312 24 5.37454 24 12.002ZM17.4086 8.15357C16.94 7.68494 16.1802 7.68494 15.7116 8.15357L10.4072 14.9579L7.62573 13.1036C7.07429 12.736 6.32925 12.885 5.96163 13.4365C5.59401 13.9879 5.74301 14.7329 6.29445 15.1006L9.89445 17.5006C10.3704 17.8179 11.0041 17.7551 11.4086 17.3506L17.4086 9.85063C17.8772 9.382 17.8772 8.6222 17.4086 8.15357Z" fill="%2300BD60"/>%0A</g>%0A</svg>%0A';
@@ -20485,14 +20477,14 @@ var Vote = ({
   questionAnsweredCorrectly,
   questionType
 }) => {
-  const [isLoadingSubmitAnswer, setIsLoadingSubmitAnswer] = (0, import_react18.useState)(false);
-  const toggleIsLoadingSubmitAnswer = (0, import_react18.useCallback)(
+  const [isLoadingSubmitAnswer, setIsLoadingSubmitAnswer] = useState2(false);
+  const toggleIsLoadingSubmitAnswer = useCallback6(
     (flag) => {
       setIsLoadingSubmitAnswer(flag);
     },
     [setIsLoadingSubmitAnswer]
   );
-  (0, import_react18.useEffect)(() => {
+  useEffect2(() => {
     toggleIsLoadingSubmitAnswer(false);
   }, [options, toggleIsLoadingSubmitAnswer]);
   return /* @__PURE__ */ jsxs10(Container8, { children: [
@@ -20889,14 +20881,14 @@ var map = (value = {}) => {
 };
 
 // node_modules/.pnpm/@nanostores+react@0.7.1_nanostores@0.9.4_react@18.2.0/node_modules/@nanostores/react/index.js
-var import_react19 = __toESM(require_react(), 1);
+import { useCallback as useCallback7, useSyncExternalStore } from "react";
 function useStore(store2, opts = {}) {
-  let subscribe2 = (0, import_react19.useCallback)(
+  let subscribe2 = useCallback7(
     (onChange2) => opts.keys ? listenKeys(store2, opts.keys, onChange2) : store2.listen(onChange2),
     [opts.keys, store2]
   );
   let get = store2.get.bind(store2);
-  return (0, import_react19.useSyncExternalStore)(subscribe2, get, get);
+  return useSyncExternalStore(subscribe2, get, get);
 }
 
 // packages/react-ui/src/lib/demo/Gamification.tsx
@@ -20944,7 +20936,7 @@ var QuestionsList = ({ store: store2, openQuestion }) => {
 // packages/react-ui/src/lib/demo/components/Question.tsx
 init_process();
 import styled14 from "@emotion/styled";
-var import_react23 = __toESM(require_react(), 1);
+import { useState as useState3, useCallback as useCallback8, useMemo as useMemo2 } from "react";
 
 // packages/react-ui/src/lib/gamification/vote/components/voting-header/index.tsx
 init_process();
@@ -21127,18 +21119,18 @@ var QuestionContainer = styled14.div`
 `;
 var Question3 = ({ store: store2, closeQuestion, vote }) => {
   const { data: openedQuestion } = useStore(store2);
-  const [answerTimeExpired, setAnswerTimeExpired] = (0, import_react23.useState)(false);
-  const setTimeToExpire = (0, import_react23.useCallback)(
+  const [answerTimeExpired, setAnswerTimeExpired] = useState3(false);
+  const setTimeToExpire = useCallback8(
     (flag) => {
       setAnswerTimeExpired(flag);
     },
     [setAnswerTimeExpired]
   );
-  const questionAnswered = (0, import_react23.useMemo)(
+  const questionAnswered = useMemo2(
     () => openedQuestion?.answers.find((answer) => answer.youVoted === true),
     [openedQuestion]
   );
-  const hasCorrectAnswer = (0, import_react23.useMemo)(
+  const hasCorrectAnswer = useMemo2(
     () => !!openedQuestion?.answers.find((answer) => answer.correct === true),
     [openedQuestion]
   );
@@ -21187,13 +21179,13 @@ var Question3 = ({ store: store2, closeQuestion, vote }) => {
 
 // packages/react-ui/src/lib/demo/components/Notifications.tsx
 init_process();
-var import_react25 = __toESM(require_react(), 1);
+import { useEffect as useEffect3, useRef as useRef2, useState as useState4 } from "react";
 import { jsx as jsx17 } from "@emotion/react/jsx-runtime";
 var Notifications = ({ notificationsStore, openQuestion }) => {
-  const timeout = (0, import_react25.useRef)();
-  const [lastNotification, setLastNotification] = (0, import_react25.useState)();
+  const timeout = useRef2();
+  const [lastNotification, setLastNotification] = useState4();
   const notifications2 = useStore(notificationsStore);
-  (0, import_react25.useEffect)(() => {
+  useEffect3(() => {
     if (notifications2) {
       setLastNotification(notifications2[notifications2.length - 1]?.data);
       timeout.current = setTimeout(() => {
@@ -21334,7 +21326,7 @@ import { jsx as jsx22 } from "@emotion/react/jsx-runtime";
 var StreamLayerThemeProvider = ({ children }) => /* @__PURE__ */ jsx22(ThemeProvider, { theme, children });
 
 // packages/react/src/app/provider.tsx
-var import_react30 = __toESM(require_react(), 1);
+import { createContext, useMemo as useMemo3 } from "react";
 
 // packages/react/src/app/useStreamLayerApp.ts
 init_process();
@@ -28322,11 +28314,11 @@ function StreamLayer(sdkKey, production = true) {
 }
 
 // packages/react/src/app/useStreamLayerApp.ts
-var import_react29 = __toESM(require_react(), 1);
+import { useState as useState5, useEffect as useEffect4 } from "react";
 window.instance = null;
 var useStreamLayerApp = (sdkKey, plugins, production) => {
-  const [sdk, setSdk] = (0, import_react29.useState)(null);
-  (0, import_react29.useEffect)(() => {
+  const [sdk, setSdk] = useState5(null);
+  useEffect4(() => {
     let ignore = false;
     if (!sdkKey) {
       throw new Error("sdk key should be provided");
@@ -28356,7 +28348,7 @@ var useStreamLayerApp = (sdkKey, plugins, production) => {
 
 // packages/react/src/app/provider.tsx
 import { jsx as jsx23 } from "@emotion/react/jsx-runtime";
-var StreamLayerContext3 = (0, import_react30.createContext)({
+var StreamLayerContext3 = createContext({
   status: 0 /* UNSET */
 });
 if (true) {
@@ -28369,7 +28361,7 @@ var StreamLayerProvider = ({
   production = true
 }) => {
   const streamLayer = useStreamLayerApp(sdkKey, plugins, production);
-  const value = (0, import_react30.useMemo)(() => {
+  const value = useMemo3(() => {
     if (!streamLayer) {
       return { status: 1 /* CONNECTED */ };
     }
@@ -28380,14 +28372,14 @@ var StreamLayerProvider = ({
 
 // packages/react/src/app/app.tsx
 init_process();
-var import_react31 = __toESM(require_react(), 1);
+import { useContext } from "react";
 import { jsx as jsx24 } from "@emotion/react/jsx-runtime";
 var useStreamLayer = () => {
-  const { sdk } = (0, import_react31.useContext)(StreamLayerContext3);
+  const { sdk } = useContext(StreamLayerContext3);
   return sdk;
 };
 var StreamLayerSDKReact = () => {
-  const { sdk, status } = (0, import_react31.useContext)(StreamLayerContext3);
+  const { sdk, status } = useContext(StreamLayerContext3);
   if (status === 0 /* UNSET */) {
     throw new Error("Wrap app in `StreamLayerProvider`");
   }