@trap_stevo/legendarybuilderproreact-ui/dist/HUDTemplates/HUDCapsuleAuthenticationPanelLaptopOrDesktop.js

The legendary UI & utility API that makes your application a legendary application. ~ Created by Steven Compton

import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _regeneratorRuntime from "@babel/runtime/regenerator";
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import * as React from 'react';
import { useState, useEffect, useRef } from 'react';
import { useNavigate } from "react-router-dom";
import { HUDUniversalHUDUtilityManager, ContainsBlacklistedCharacters, HomePanelNavigationActivation } from "../HUDManagers/HUDUniversalHUDUtilityManager.js";
import { useAuth } from "../HUDComponents/AuthProvider.js";
import HUDTyper from "../HUDComponents/HUDTyper.js";
function HUDCapsuleAuthenticationPanelLaptopOrDesktop(hudCapsuleAuthenticationPanelConfiguration) {
  var hudCapsuleAuthenticationPanelLaptopOrDesktopContainerConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopContainerConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInProcessIndicatorCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInProcessIndicatorCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInHeaderDividerCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInHeaderDividerCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInUsernameConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInUsernameConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInPasswordConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInPasswordConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInPasswordRenewalButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInPasswordRenewalButtonConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignInButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignInButtonConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalProcessIndicatorCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalProcessIndicatorCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalHeaderDividerCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalHeaderDividerCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalEmailConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalEmailConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignInButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignInButtonConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignUpButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignUpButtonConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalButtonConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpProcessIndicatorCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpProcessIndicatorCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpHeaderDividerCapsuleConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpHeaderDividerCapsuleConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpFirstNameConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpFirstNameConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpLastNameConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpLastNameConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpUsernameConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpUsernameConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpEmailConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpEmailConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpPasswordConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpPasswordConfigurationSettings,
    hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpButtonConfigurationSettings = hudCapsuleAuthenticationPanelConfiguration.hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpButtonConfigurationSettings,
    authenticationCapsuleHoverIdleActivation = hudCapsuleAuthenticationPanelConfiguration.authenticationCapsuleHoverIdleActivation,
    authenticationCapsuleIdlePositionO = hudCapsuleAuthenticationPanelConfiguration.authenticationCapsuleIdlePositionO,
    authenticationCapsuleIdlePositionT = hudCapsuleAuthenticationPanelConfiguration.authenticationCapsuleIdlePositionT,
    authenticationCapsuleHoverIdling = hudCapsuleAuthenticationPanelConfiguration.authenticationCapsuleHoverIdling,
    authenticationCapsuleHover = hudCapsuleAuthenticationPanelConfiguration.authenticationCapsuleHover,
    authenticationRenewalProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.authenticationRenewalProcessIndicator,
    processingAuthenticationRenewalAction = hudCapsuleAuthenticationPanelConfiguration.processingAuthenticationRenewalAction,
    authenticationRenewalButtonHover = hudCapsuleAuthenticationPanelConfiguration.authenticationRenewalButtonHover,
    passwordRenewalEmailInputFocus = hudCapsuleAuthenticationPanelConfiguration.passwordRenewalEmailInputFocus,
    passwordRenewalEmailInputValue = hudCapsuleAuthenticationPanelConfiguration.passwordRenewalEmailInputValue,
    authenticationRenewalActivated = hudCapsuleAuthenticationPanelConfiguration.authenticationRenewalActivated,
    signUpProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.signUpProcessIndicator,
    processingSignUpAction = hudCapsuleAuthenticationPanelConfiguration.processingSignUpAction,
    loginProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.loginProcessIndicator,
    processingLoginAction = hudCapsuleAuthenticationPanelConfiguration.processingLoginAction,
    signUpButtonHover = hudCapsuleAuthenticationPanelConfiguration.signUpButtonHover,
    loginButtonHover = hudCapsuleAuthenticationPanelConfiguration.loginButtonHover,
    backButtonHover = hudCapsuleAuthenticationPanelConfiguration.backButtonHover,
    loginUsernameInputFocus = hudCapsuleAuthenticationPanelConfiguration.loginUsernameInputFocus,
    loginPasswordInputFocus = hudCapsuleAuthenticationPanelConfiguration.loginPasswordInputFocus,
    loginUsernameInputValue = hudCapsuleAuthenticationPanelConfiguration.loginUsernameInputValue,
    loginPasswordInputValue = hudCapsuleAuthenticationPanelConfiguration.loginPasswordInputValue,
    loginPasswordShown = hudCapsuleAuthenticationPanelConfiguration.loginPasswordShown,
    signUpFirstNameInputFocus = hudCapsuleAuthenticationPanelConfiguration.signUpFirstNameInputFocus,
    signUpLastNameInputFocus = hudCapsuleAuthenticationPanelConfiguration.signUpLastNameInputFocus,
    signUpUsernameInputFocus = hudCapsuleAuthenticationPanelConfiguration.signUpUsernameInputFocus,
    signUpEmailInputFocus = hudCapsuleAuthenticationPanelConfiguration.signUpEmailInputFocus,
    signUpPasswordInputFocus = hudCapsuleAuthenticationPanelConfiguration.signUpPasswordInputFocus,
    signUpFirstNameInputValue = hudCapsuleAuthenticationPanelConfiguration.signUpFirstNameInputValue,
    signUpLastNameInputValue = hudCapsuleAuthenticationPanelConfiguration.signUpLastNameInputValue,
    signUpUsernameInputValue = hudCapsuleAuthenticationPanelConfiguration.signUpUsernameInputValue,
    signUpEmailInputValue = hudCapsuleAuthenticationPanelConfiguration.signUpEmailInputValue,
    signUpPasswordInputValue = hudCapsuleAuthenticationPanelConfiguration.signUpPasswordInputValue,
    signUpPasswordShown = hudCapsuleAuthenticationPanelConfiguration.signUpPasswordShown,
    requestIdleAnimationRef = hudCapsuleAuthenticationPanelConfiguration.requestIdleAnimationRef,
    originNavigation = hudCapsuleAuthenticationPanelConfiguration.originNavigation,
    hudNavigator = hudCapsuleAuthenticationPanelConfiguration.hudNavigator,
    passwordRenewalAction = hudCapsuleAuthenticationPanelConfiguration.passwordRenewalAction,
    signInAction = hudCapsuleAuthenticationPanelConfiguration.signInAction,
    signUpAction = hudCapsuleAuthenticationPanelConfiguration.signUpAction,
    handleLoginUsernameInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginUsernameInputInFocusUpdate,
    handleLoginUsernameInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginUsernameInputBlurUpdate,
    handleLoginPasswordInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginPasswordInputInFocusUpdate,
    handleLoginPasswordInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginPasswordInputBlurUpdate,
    handleLoginUsernameInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginUsernameInputUpdate,
    handleLoginPasswordInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleLoginPasswordInputUpdate,
    handlePasswordRenewalEmailInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handlePasswordRenewalEmailInputInFocusUpdate,
    handlePasswordRenewalEmailInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handlePasswordRenewalEmailInputBlurUpdate,
    handlePasswordRenewalEmailInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handlePasswordRenewalEmailInputUpdate,
    handleSignUpFirstNameInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpFirstNameInputInFocusUpdate,
    handleSignUpFirstNameInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpFirstNameInputBlurUpdate,
    handleSignUpLastNameInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpLastNameInputInFocusUpdate,
    handleSignUpLastNameInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpLastNameInputBlurUpdate,
    handleSignUpUsernameInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpUsernameInputInFocusUpdate,
    handleSignUpUsernameInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpUsernameInputBlurUpdate,
    handleSignUpEmailInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpEmailInputInFocusUpdate,
    handleSignUpEmailInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpEmailInputBlurUpdate,
    handleSignUpPasswordInputInFocusUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpPasswordInputInFocusUpdate,
    handleSignUpPasswordInputBlurUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpPasswordInputBlurUpdate,
    handleSignUpFirstNameInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpFirstNameInputUpdate,
    handleSignUpLastNameInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpLastNameInputUpdate,
    handleSignUpUsernameInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpUsernameInputUpdate,
    handleSignUpEmailInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpEmailInputUpdate,
    handleSignUpPasswordInputUpdate = hudCapsuleAuthenticationPanelConfiguration.handleSignUpPasswordInputUpdate,
    updateauthenticationCapsuleIdlePosition = hudCapsuleAuthenticationPanelConfiguration.updateauthenticationCapsuleIdlePosition,
    bridgedNavigationHandler = hudCapsuleAuthenticationPanelConfiguration.bridgedNavigationHandler,
    setSelectedAuthenticationCapsule = hudCapsuleAuthenticationPanelConfiguration.setSelectedAuthenticationCapsule,
    bridgedNavigation = hudCapsuleAuthenticationPanelConfiguration.bridgedNavigation,
    setAuthenticationCapsuleHoverIdleActivation = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationCapsuleHoverIdleActivation,
    setAuthenticationCapsuleIdlePositionO = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationCapsuleIdlePositionO,
    setAuthenticationCapsuleIdlePositionT = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationCapsuleIdlePositionT,
    setAuthenticationCapsuleHoverIdling = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationCapsuleHoverIdling,
    setAuthenticationCapsuleHover = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationCapsuleHover,
    setAuthenticationRenewalProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationRenewalProcessIndicator,
    setProcessingAuthenticationRenewalAction = hudCapsuleAuthenticationPanelConfiguration.setProcessingAuthenticationRenewalAction,
    setAuthenticationRenewalButtonHover = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationRenewalButtonHover,
    setPasswordRenewalEmailInputFocus = hudCapsuleAuthenticationPanelConfiguration.setPasswordRenewalEmailInputFocus,
    setPasswordRenewalEmailInputValue = hudCapsuleAuthenticationPanelConfiguration.setPasswordRenewalEmailInputValue,
    setAuthenticationRenewalActivated = hudCapsuleAuthenticationPanelConfiguration.setAuthenticationRenewalActivated,
    setSignUpProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.setSignUpProcessIndicator,
    setProcessingSignUpAction = hudCapsuleAuthenticationPanelConfiguration.setProcessingSignUpAction,
    setLoginProcessIndicator = hudCapsuleAuthenticationPanelConfiguration.setLoginProcessIndicator,
    setProcessingLoginAction = hudCapsuleAuthenticationPanelConfiguration.setProcessingLoginAction,
    setSignUpButtonHover = hudCapsuleAuthenticationPanelConfiguration.setSignUpButtonHover,
    setLoginButtonHover = hudCapsuleAuthenticationPanelConfiguration.setLoginButtonHover,
    setBackButtonHover = hudCapsuleAuthenticationPanelConfiguration.setBackButtonHover,
    setLoginUsernameInputFocus = hudCapsuleAuthenticationPanelConfiguration.setLoginUsernameInputFocus,
    setLoginPasswordInputFocus = hudCapsuleAuthenticationPanelConfiguration.setLoginPasswordInputFocus,
    setLoginUsernameInputValue = hudCapsuleAuthenticationPanelConfiguration.setLoginUsernameInputValue,
    setLoginPasswordInputValue = hudCapsuleAuthenticationPanelConfiguration.setLoginPasswordInputValue,
    setLoginPasswordShown = hudCapsuleAuthenticationPanelConfiguration.setLoginPasswordShown,
    setSignUpFirstNameInputFocus = hudCapsuleAuthenticationPanelConfiguration.setSignUpFirstNameInputFocus,
    setSignUpLastNameInputFocus = hudCapsuleAuthenticationPanelConfiguration.setSignUpLastNameInputFocus,
    setSignUpUsernameInputFocus = hudCapsuleAuthenticationPanelConfiguration.setSignUpUsernameInputFocus,
    setSignUpEmailInputFocus = hudCapsuleAuthenticationPanelConfiguration.setSignUpEmailInputFocus,
    setSignUpPasswordInputFocus = hudCapsuleAuthenticationPanelConfiguration.setSignUpPasswordInputFocus,
    setSignUpFirstNameInputValue = hudCapsuleAuthenticationPanelConfiguration.setSignUpFirstNameInputValue,
    setSignUpLastNameInputValue = hudCapsuleAuthenticationPanelConfiguration.setSignUpLastNameInputValue,
    setSignUpUsernameInputValue = hudCapsuleAuthenticationPanelConfiguration.setSignUpUsernameInputValue,
    setSignUpEmailInputValue = hudCapsuleAuthenticationPanelConfiguration.setSignUpEmailInputValue,
    setSignUpPasswordInputValue = hudCapsuleAuthenticationPanelConfiguration.setSignUpPasswordInputValue,
    setSignUpPasswordShown = hudCapsuleAuthenticationPanelConfiguration.setSignUpPasswordShown;
  var _useAuth = useAuth(),
    signedUser = _useAuth.signedUser,
    setSignedUser = _useAuth.setSignedUser,
    signedIn = _useAuth.signedIn,
    signIn = _useAuth.signIn,
    signOut = _useAuth.signOut;
  var screenWidth = window.innerWidth;
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      width: "100vw",
      background: "transparent"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "row",
      justifyContent: "center",
      width: "100vw",
      background: "transparent",
      marginBottom: "3rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopContainerConfigurationSettings)
  }, authenticationRenewalActivated === "" && processingSignUpAction === false && /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      height: processingLoginAction ? "4.269rem" : "24rem",
      width: "40vw",
      scale: authenticationCapsuleHover === "Login Capsule" ? "1.069" : authenticationCapsuleHover === null ? "1" : "0.69",
      opacity: authenticationCapsuleHover === "Login Capsule" ? "1" : authenticationCapsuleHover === null ? "1" : "0.2169",
      transform: !processingLoginAction ? authenticationCapsuleHover === "Login Capsule" ? "translate(50%, 0%)" : authenticationCapsuleHoverIdling === "false" ? "translate(".concat(authenticationCapsuleIdlePositionT.x, "%, ").concat(authenticationCapsuleIdlePositionT.y, "%) rotate(").concat(authenticationCapsuleIdlePositionT.y, "deg)") : authenticationCapsuleHoverIdling === "true" ? "translate(-".concat(authenticationCapsuleIdlePositionT.x, "%, -").concat(authenticationCapsuleIdlePositionT.y, "%) rotate(-").concat(authenticationCapsuleIdlePositionT.x, "deg)") : "translate(0%, 0%)" : null,
      transition: "scale 0.69s ease-in-out, opacity 0.869s ease-in-out, transform 1.969s ease, height 0.869s ease",
      borderRadius: "3rem",
      boxShadow: "inset 0 0 5px rgba(0, 0, 0, 0.269)",
      zIndex: authenticationCapsuleHover === "Login Capsule" ? "27" : null,
      background: "#eeeeee",
      marginTop: "3rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInCapsuleConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setAuthenticationCapsuleHover(null);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setAuthenticationCapsuleHover("Login Capsule");
      setAuthenticationCapsuleHoverIdleActivation(false);
      setAuthenticationCapsuleHoverIdling("");
      return;
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      gap: "9px",
      width: "100%",
      textAlign: "center",
      color: "black",
      fontSize: "1.369rem",
      fontWeight: "bold",
      wordWrap: "break-word",
      userSelect: "none",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInProcessIndicatorCapsuleConfigurationSettings)
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 12
  }, loginProcessIndicator)), /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      background: "#242424",
      flexDirection: "column",
      alignItems: "center",
      height: "0.469rem",
      opacity: 0.469,
      width: "100%",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInHeaderDividerCapsuleConfigurationSettings)
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingLoginAction ? "hidden" : "visible",
      gap: "9px",
      width: "100%",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: "text",
    placeholder: "Username...",
    onFocus: handleLoginUsernameInputInFocusUpdate,
    onBlur: handleLoginUsernameInputBlurUpdate,
    onChange: handleLoginUsernameInputUpdate,
    value: loginUsernameInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: loginUsernameInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: loginUsernameInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "47%",
      height: processingLoginAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInUsernameConfigurationSettings)
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingLoginAction ? "hidden" : "visible",
      gap: "9px",
      width: "100%",
      marginTop: "1.69rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingLoginAction ? "hidden" : "visible",
      gap: "9px",
      width: "47%"
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: loginPasswordShown ? "text" : "password",
    placeholder: "Password...",
    onFocus: handleLoginPasswordInputInFocusUpdate,
    onBlur: handleLoginPasswordInputBlurUpdate,
    onChange: handleLoginPasswordInputUpdate,
    value: loginPasswordInputValue,
    style: _objectSpread({
      flexGrow: 1,
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: loginPasswordInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: loginPasswordInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "100%",
      height: processingLoginAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInUsernameConfigurationSettings)
  }), /*#__PURE__*/React.createElement("span", {
    style: {
      position: "absolute",
      transition: "right 0.69s ease",
      transform: "translateY(-50%)",
      userSelect: "none",
      scale: "1.269",
      right: loginPasswordInputFocus ? "-15px" : "10px",
      top: "50%",
      cursor: "pointer"
    },
    onClick: function onClick() {
      setLoginPasswordShown(!loginPasswordShown);
    }
  }, loginPasswordShown ? "👁️" : "👁️‍🗨️"))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      visibility: processingLoginAction ? "hidden" : "visible",
      marginTop: "1rem"
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 12
  }, "Forget your password?"), /*#__PURE__*/React.createElement("span", {
    style: _objectSpread({
      color: "#AA1A1A",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInPasswordRenewalButtonConfigurationSettings),
    onClick: function onClick() {
      setAuthenticationRenewalActivated("Authentication Password Renewal");
      return;
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 1
  }, "Click here")), ".")), !processingLoginAction && loginUsernameInputValue && loginPasswordInputValue && loginUsernameInputValue.trim() !== "" && loginPasswordInputValue.trim() !== "" && /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      alignItems: "center",
      transition: "transform 0.269s ease-in-out",
      transform: "translate(0%, -50%)",
      display: "flex",
      marginBottom: "3rem",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      borderRadius: "40px",
      border: "1px #aa1a1a solid",
      background: loginButtonHover ? "#d10300" : "#AA1A1A",
      width: "auto",
      height: "auto",
      textAlign: "center",
      fontWeight: "bold",
      scale: loginButtonHover ? "1.269" : "1",
      transition: "scale 0.69s ease-in-out, background 0.369s ease-in-out",
      paddingBottom: "0.469rem",
      paddingRight: "1rem",
      paddingLeft: "1rem",
      paddingTop: "0.269rem",
      color: "white",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignInButtonConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setLoginButtonHover(false);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setLoginButtonHover(true);
      return;
    },
    onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      var timer, processIndicatorTimer;
      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) switch (_context.prev = _context.next) {
          case 0:
            setProcessingLoginAction(true);
            setLoginButtonHover(false);
            setLoginProcessIndicator("Logging In...");
            _context.t0 = signInAction;
            if (!_context.t0) {
              _context.next = 9;
              break;
            }
            _context.next = 7;
            return signInAction(loginUsernameInputValue, loginPasswordInputValue, signedUser, setSignedUser, signedIn, signIn, signOut);
          case 7:
            _context.t1 = _context.sent;
            _context.t0 = _context.t1 === true;
          case 9:
            if (!_context.t0) {
              _context.next = 13;
              break;
            }
            setLoginProcessIndicator("Successfully Logged In!");
            timer = setTimeout(function () {
              if (bridgedNavigationHandler === undefined || bridgedNavigationHandler === null) {
                return;
              }
              if (bridgedNavigation === null || bridgedNavigation === undefined || bridgedNavigationHandler[bridgedNavigation] === null || bridgedNavigationHandler[bridgedNavigation] === undefined) {
                HomePanelNavigationActivation(hudNavigator);
                return;
              }
              bridgedNavigationHandler[bridgedNavigation](hudNavigator);
              return;
            }, 1000);
            return _context.abrupt("return", function () {
              return clearInterval(timer);
            });
          case 13:
            setLoginUsernameInputValue("");
            setLoginPasswordInputValue("");
            setLoginProcessIndicator("Try Again.");
            setProcessingLoginAction(false);
            processIndicatorTimer = setTimeout(function () {
              setLoginProcessIndicator("Log In.");
            }, 1000);
            return _context.abrupt("return", function () {
              return clearInterval(processIndicatorTimer);
            });
          case 19:
          case "end":
            return _context.stop();
        }
      }, _callee);
    }))
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 5
  }, "Login")))), authenticationRenewalActivated !== "" && /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      height: processingAuthenticationRenewalAction ? "4.269rem" : "24rem",
      width: "40vw",
      scale: authenticationCapsuleHover === "Authentication Renewal Capsule" ? "1.069" : authenticationCapsuleHover === null ? "1" : "0.69",
      opacity: authenticationCapsuleHover === "Authentication Renewal Capsule" ? "1" : authenticationCapsuleHover === null ? "1" : "0.2169",
      transform: !processingAuthenticationRenewalAction ? authenticationCapsuleHover === "Authentication Renewal Capsule" ? "translate(0%, 0%)" : authenticationCapsuleHoverIdling === "false" ? "translate(".concat(authenticationCapsuleIdlePositionT.x, "%, ").concat(authenticationCapsuleIdlePositionT.y, "%) rotate(").concat(authenticationCapsuleIdlePositionT.y, "deg)") : authenticationCapsuleHoverIdling === "true" ? "translate(-".concat(authenticationCapsuleIdlePositionT.x, "%, -").concat(authenticationCapsuleIdlePositionT.y, "%) rotate(-").concat(authenticationCapsuleIdlePositionT.x, "deg)") : "translate(0%, 0%)" : null,
      transition: "scale 0.69s ease-in-out, opacity 0.869s ease-in-out, transform 1.969s ease, height 0.869s ease",
      borderRadius: "3rem",
      boxShadow: "inset 0 0 5px rgba(0, 0, 0, 0.269)",
      zIndex: authenticationCapsuleHover === "Authentication Renewal Capsule" ? "27" : null,
      background: "#eeeeee",
      marginTop: "3rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalCapsuleConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setAuthenticationCapsuleHover(null);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setAuthenticationCapsuleHover("Authentication Renewal Capsule");
      setAuthenticationCapsuleHoverIdleActivation(false);
      setAuthenticationCapsuleHoverIdling("");
      return;
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      gap: "9px",
      width: "100%",
      textAlign: "center",
      color: "black",
      fontSize: "1.369rem",
      fontWeight: "bold",
      wordWrap: "break-word",
      userSelect: "none",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalProcessIndicatorCapsuleConfigurationSettings)
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 12
  }, authenticationRenewalProcessIndicator)), /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      background: "#242424",
      flexDirection: "column",
      alignItems: "center",
      height: "0.469rem",
      opacity: 0.469,
      width: "100%",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalHeaderDividerCapsuleConfigurationSettings)
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingAuthenticationRenewalAction ? "hidden" : "visible",
      gap: "9px",
      width: "100%",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: "email",
    placeholder: "Email...",
    onFocus: handlePasswordRenewalEmailInputInFocusUpdate,
    onBlur: handlePasswordRenewalEmailInputBlurUpdate,
    onChange: handlePasswordRenewalEmailInputUpdate,
    value: passwordRenewalEmailInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: passwordRenewalEmailInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: passwordRenewalEmailInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "47%",
      height: processingAuthenticationRenewalAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalEmailConfigurationSettings)
  })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      visibility: processingAuthenticationRenewalAction ? "hidden" : "visible",
      marginTop: "1rem"
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 12
  }, "Remember your account?"), /*#__PURE__*/React.createElement("span", {
    style: _objectSpread({
      color: "#AA1A1A",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignInButtonConfigurationSettings),
    onClick: function onClick() {
      setAuthenticationCapsuleHover("Login Capsule");
      setAuthenticationRenewalActivated("");
      return;
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 1
  }, "Click here")), "."), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      visibility: processingAuthenticationRenewalAction ? "hidden" : "visible",
      marginTop: "1rem"
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 12
  }, "Need an account?"), /*#__PURE__*/React.createElement("span", {
    style: _objectSpread({
      color: "#AA1A1A",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalSignUpButtonConfigurationSettings),
    onClick: function onClick() {
      setAuthenticationCapsuleHover("Create Account Capsule");
      setAuthenticationRenewalActivated("");
      return;
    }
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 1
  }, "Click here")), ".")), !processingAuthenticationRenewalAction && passwordRenewalEmailInputValue && passwordRenewalEmailInputValue.trim() !== "" && HUDUniversalHUDUtilityManager.CheckEmail(passwordRenewalEmailInputValue.trim()) && /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      alignItems: "center",
      transition: "transform 0.269s ease-in-out",
      transform: "translate(0%, -50%)",
      display: "flex",
      marginBottom: "3rem",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      borderRadius: "40px",
      border: "1px #aa1a1a solid",
      background: authenticationRenewalButtonHover ? "#d10300" : "#AA1A1A",
      width: "auto",
      height: "auto",
      textAlign: "center",
      fontWeight: "bold",
      scale: authenticationRenewalButtonHover ? "1.269" : "1",
      transition: "scale 0.69s ease-in-out, background 0.369s ease-in-out",
      paddingBottom: "0.469rem",
      paddingRight: "1rem",
      paddingLeft: "1rem",
      paddingTop: "0.269rem",
      color: "white",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopAuthenticationRenewalButtonConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setAuthenticationRenewalButtonHover(false);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setAuthenticationRenewalButtonHover(true);
      return;
    },
    onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
      var timer, processIndicatorTimer;
      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
        while (1) switch (_context2.prev = _context2.next) {
          case 0:
            setProcessingAuthenticationRenewalAction(true);
            setAuthenticationRenewalButtonHover(false);
            setAuthenticationRenewalProcessIndicator("Sending Password Renewal Email...");
            _context2.t0 = passwordRenewalAction;
            if (!_context2.t0) {
              _context2.next = 9;
              break;
            }
            _context2.next = 7;
            return passwordRenewalAction(passwordRenewalEmailInputValue);
          case 7:
            _context2.t1 = _context2.sent;
            _context2.t0 = _context2.t1 === true;
          case 9:
            if (!_context2.t0) {
              _context2.next = 13;
              break;
            }
            setAuthenticationRenewalProcessIndicator("Check Your Email!");
            timer = setTimeout(function () {
              setProcessingAuthenticationRenewalAction(false);
              setAuthenticationRenewalProcessIndicator("Request Password Renewal.");
              setAuthenticationCapsuleHover("Login Capsule");
              setAuthenticationRenewalActivated("");
              return;
            }, 2000);
            return _context2.abrupt("return", function () {
              return clearInterval(timer);
            });
          case 13:
            setPasswordRenewalEmailInputValue("");
            setAuthenticationRenewalProcessIndicator("Did Not Send Email.");
            setProcessingAuthenticationRenewalAction(false);
            processIndicatorTimer = setTimeout(function () {
              setAuthenticationRenewalProcessIndicator("Request Password Renewal.");
            }, 1000);
            return _context2.abrupt("return", function () {
              return clearInterval(processIndicatorTimer);
            });
          case 18:
          case "end":
            return _context2.stop();
        }
      }, _callee2);
    }))
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 5
  }, "Request")))), authenticationRenewalActivated === "" && processingLoginAction === false && /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      height: processingSignUpAction ? "4rem" : null,
      width: "40vw",
      borderRadius: "3rem",
      boxShadow: "inset 0 0 5px rgba(0, 0, 0, 0.269)",
      scale: authenticationCapsuleHover === "Create Account Capsule" ? "1.069" : authenticationCapsuleHover === null ? "1" : "0.69",
      opacity: authenticationCapsuleHover === "Create Account Capsule" ? "1" : authenticationCapsuleHover === null ? "1" : "0.2169",
      transform: !processingSignUpAction ? authenticationCapsuleHover === "Create Account Capsule" ? "translate(-50%, 0%)" : authenticationCapsuleHoverIdling === "true" ? "translate(".concat(authenticationCapsuleIdlePositionO.x, "%, ").concat(authenticationCapsuleIdlePositionO.y, "%) rotate(").concat(authenticationCapsuleIdlePositionO.x, "deg)") : authenticationCapsuleHoverIdling === "false" ? "translate(-".concat(authenticationCapsuleIdlePositionO.x, "%, -").concat(authenticationCapsuleIdlePositionO.y, "%) rotate(-").concat(authenticationCapsuleIdlePositionO.y, "deg)") : "translate(0%, 0%)" : null,
      transition: "scale 0.69s ease-in-out, opacity 0.869s ease-in-out, transform 1.969s ease, height 0.869s ease",
      zIndex: authenticationCapsuleHover === "Create Account Capsule" ? "27" : null,
      background: "#eeeeee",
      marginLeft: "2rem",
      marginTop: "3rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpCapsuleConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setAuthenticationCapsuleHover(null);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setAuthenticationCapsuleHover("Create Account Capsule");
      setAuthenticationCapsuleHoverIdleActivation(false);
      setAuthenticationCapsuleHoverIdling("");
      return;
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      gap: "9px",
      width: "100%",
      textAlign: "center",
      color: "black",
      fontSize: "1.369rem",
      fontWeight: "bold",
      wordWrap: "break-word",
      userSelect: "none",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpProcessIndicatorCapsuleConfigurationSettings)
  }, /*#__PURE__*/React.createElement(HUDTyper, {
    speed: 7
  }, signUpProcessIndicator)), /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      position: "relative",
      display: "flex",
      background: "#242424",
      flexDirection: "column",
      alignItems: "center",
      height: "0.469rem",
      opacity: 0.469,
      width: "100%",
      marginTop: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpHeaderDividerCapsuleConfigurationSettings)
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingSignUpAction ? "hidden" : "visible",
      gap: "9px",
      width: "100%",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      justifyContent: "center",
      flexDirection: "row",
      width: "100%"
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: "text",
    placeholder: "First Name...",
    onFocus: handleSignUpFirstNameInputInFocusUpdate,
    onBlur: handleSignUpFirstNameInputBlurUpdate,
    onChange: handleSignUpFirstNameInputUpdate,
    value: signUpFirstNameInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: signUpFirstNameInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: signUpFirstNameInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "30%",
      height: processingSignUpAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem",
      marginRight: "1rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpFirstNameConfigurationSettings)
  }), /*#__PURE__*/React.createElement("input", {
    type: "text",
    placeholder: "Last Name...",
    onFocus: handleSignUpLastNameInputInFocusUpdate,
    onBlur: handleSignUpLastNameInputBlurUpdate,
    onChange: handleSignUpLastNameInputUpdate,
    value: signUpLastNameInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: signUpLastNameInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: signUpLastNameInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "30%",
      height: processingSignUpAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpLastNameConfigurationSettings)
  })), /*#__PURE__*/React.createElement("input", {
    type: "text",
    placeholder: "Username...",
    onFocus: handleSignUpUsernameInputInFocusUpdate,
    onBlur: handleSignUpUsernameInputBlurUpdate,
    onChange: handleSignUpUsernameInputUpdate,
    value: signUpUsernameInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: signUpUsernameInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: signUpUsernameInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "47%",
      height: processingSignUpAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem",
      marginTop: "1.269rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpUsernameConfigurationSettings)
  }), /*#__PURE__*/React.createElement("input", {
    type: "email",
    placeholder: "Email...",
    onFocus: handleSignUpEmailInputInFocusUpdate,
    onBlur: handleSignUpEmailInputBlurUpdate,
    onChange: handleSignUpEmailInputUpdate,
    value: signUpEmailInputValue,
    style: _objectSpread({
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: signUpEmailInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: signUpEmailInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "47%",
      height: processingSignUpAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem",
      marginTop: "1.269rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpEmailConfigurationSettings)
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingLoginAction ? "hidden" : "visible",
      gap: "9px",
      width: "100%",
      marginTop: "1.69rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      alignItems: "center",
      visibility: processingSignUpAction ? "hidden" : "visible",
      gap: "9px",
      width: "47%"
    }
  }, /*#__PURE__*/React.createElement("input", {
    type: signUpPasswordShown ? "text" : "password",
    placeholder: "Password...",
    onFocus: handleSignUpPasswordInputInFocusUpdate,
    onBlur: handleSignUpPasswordInputBlurUpdate,
    onChange: handleSignUpPasswordInputUpdate,
    value: signUpPasswordInputValue,
    style: _objectSpread({
      flexGrow: 1,
      background: "rgba(217, 217, 217, 0.25)",
      borderRadius: "1rem",
      border: "1px black solid",
      outline: "none",
      boxShadow: signUpPasswordInputFocus ? "5px 5px 5px -4.69px rgba(0, 0, 0, 0.469)" : "none",
      scale: signUpPasswordInputFocus ? "1.169" : "1",
      transition: "scale 0.269s ease-in-out, box-shadow 0.369s ease-in-out",
      width: "100%",
      height: processingSignUpAction ? "0rem" : "2rem",
      fontSize: "1.269rem",
      paddingLeft: "0.69rem"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpPasswordConfigurationSettings)
  }), /*#__PURE__*/React.createElement("span", {
    style: {
      position: "absolute",
      transition: "right 0.69s ease",
      transform: "translateY(-50%)",
      userSelect: "none",
      scale: "1.269",
      right: signUpPasswordInputFocus ? "-15px" : "10px",
      top: "50%",
      cursor: "pointer"
    },
    onClick: function onClick() {
      setSignUpPasswordShown(!signUpPasswordShown);
    }
  }, signUpPasswordShown ? "👁️" : "👁️‍🗨️"))), processingSignUpAction === false && signUpFirstNameInputValue && signUpLastNameInputValue && signUpEmailInputValue && signUpUsernameInputValue && signUpPasswordInputValue && signUpFirstNameInputValue.trim() !== "" && signUpLastNameInputValue.trim() !== "" && signUpEmailInputValue.trim() !== "" && HUDUniversalHUDUtilityManager.CheckEmail(signUpEmailInputValue) === true && signUpUsernameInputValue.trim() !== "" && signUpPasswordInputValue.trim() !== "" && signUpPasswordInputValue.trim().length >= 8 && /*#__PURE__*/React.createElement("div", {
    style: {
      position: "relative",
      alignItems: "center",
      transition: "transform 0.269s ease-in-out",
      transform: "translate(0%, -50%)",
      display: "flex",
      marginBottom: "3rem",
      marginTop: "3rem"
    }
  }, /*#__PURE__*/React.createElement("div", {
    style: _objectSpread({
      borderRadius: "40px",
      border: "1px #aa1a1a solid",
      background: signUpButtonHover ? "#d10300" : "#AA1A1A",
      width: "auto",
      height: "auto",
      textAlign: "center",
      fontWeight: "bold",
      scale: signUpButtonHover ? "1.269" : "1",
      transition: "scale 0.69s ease-in-out, background 0.369s ease-in-out",
      paddingBottom: "0.469rem",
      paddingRight: "1rem",
      paddingLeft: "1rem",
      paddingTop: "0.269rem",
      color: "white",
      cursor: "pointer"
    }, hudCapsuleAuthenticationPanelLaptopOrDesktopSignUpButtonConfigurationSettings),
    onMouseLeave: function onMouseLeave() {
      setSignUpButtonHover(false);
      return;
    },
    onMouseEnter: function onMouseEnter() {
      setSignUpButtonHover(true);
      return;
    },
    onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
      var timer, processIndicatorTimer;
      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
        while (1) switch (_context3.prev = _context3.next) {
          case 0: