// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders form 1`] = `
<div
  className="InviteLayout-root"
  data-testid="invite-complete-container"
>
  <div
    className="AppBar-root AppBar-gutterBegin AppBar-gutterEnd"
  >
    <div
      className="Box-root Flex-root AppBar-container Flex-flex"
    >
      <div
        className="Box-root Flex-root Begin-root Flex-flex Flex-doubleItemGutter Flex-alignCenter gutter"
      >
        <div
          className="InviteLayout-logoContainer"
        >
          <h1
            aria-hidden={true}
            className="LogoHorizontal-hiddenTitle"
          >
            Coral
          </h1>
          <img
            alt=""
            className="LogoHorizontal-base"
            src="logo@2x.png"
          />
        </div>
      </div>
    </div>
  </div>
  <div
    className="Box-root Flex-root Flex-flex Flex-justifyCenter Flex-alignCenter Flex-directionColumn Box-ml-8 Box-mr-8 Box-mt-8 Box-mb-8"
  >
    <div
      data-testid="invite-complete-form"
    >
      <div
        className="Box-root Flex-root Flex-flex Flex-justifyCenter Flex-alignCenter Flex-directionColumn gutter Flex-spacing-3"
      >
        <h1
          className="Box-root Typography-root Typography-heading1 Typography-colorTextPrimary"
        >
          You've been invited to join Coral
        </h1>
        <p
          className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
        >
          Finish setting up the account for:
        </p>
        <h1
          className="Box-root Typography-root Typography-heading2 Typography-colorTextPrimary"
        >
          lukas@test.com
        </h1>
      </div>
      <form
        autoComplete="off"
        onSubmit={[Function]}
      >
        <div
          className="Box-root HorizontalGutter-root InviteCompleteForm-root HorizontalGutter-double Box-pt-4"
        >
          <div
            className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
          >
            <label
              className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
              htmlFor="username"
            >
              Username
            </label>
            <p
              className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
            >
              You may use “_” and “.”
            </p>
            <div
              className="TextField-root TextField-fullWidth"
            >
              <input
                className="TextField-input TextField-colorRegular"
                disabled={false}
                id="username"
                name="username"
                onBlur={[Function]}
                onChange={[Function]}
                onFocus={[Function]}
                placeholder="Username"
                type="text"
                value=""
              />
            </div>
          </div>
          <div
            className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
          >
            <label
              className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
              htmlFor="password"
            >
              Password
            </label>
            <p
              className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
            >
              Must be at least 8 characters
            </p>
            <div
              className="PasswordField-fullWidth PasswordField-root"
            >
              <div
                className="PasswordField-wrapper"
              >
                <input
                  autoCapitalize="off"
                  autoComplete="new-password"
                  autoCorrect="off"
                  className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
                  disabled={false}
                  id="password"
                  name="password"
                  onBlur={[Function]}
                  onChange={[Function]}
                  onFocus={[Function]}
                  placeholder="Password"
                  spellCheck={false}
                  type="password"
                  value=""
                />
                <div
                  className="PasswordField-icon"
                  onClick={[Function]}
                  onKeyUp={[Function]}
                  role="button"
                  tabIndex={0}
                  title="Hide password"
                >
                  <i
                    aria-hidden="true"
                    className="Icon-root Icon-sm"
                  >
                    visibility
                  </i>
                </div>
              </div>
            </div>
          </div>
          <button
            className="BaseButton-root Button-root Button-sizeRegular Button-colorBrand Button-variantFilled Button-fullWidth"
            data-color="brand"
            data-variant="filled"
            disabled={false}
            onBlur={[Function]}
            onFocus={[Function]}
            onMouseOut={[Function]}
            onMouseOver={[Function]}
            onTouchEnd={[Function]}
            type="submit"
          >
            Create Account
          </button>
        </div>
      </form>
    </div>
  </div>
  <p
    className="Box-root Typography-root Typography-detail Typography-colorTextPrimary Version-version"
  >
    vTest
  </p>
</div>
`;

exports[`renders missing the token 1`] = `
<div
  className="InviteLayout-root"
  data-testid="invite-complete-container"
>
  <div
    className="AppBar-root AppBar-gutterBegin AppBar-gutterEnd"
  >
    <div
      className="Box-root Flex-root AppBar-container Flex-flex"
    >
      <div
        className="Box-root Flex-root Begin-root Flex-flex Flex-doubleItemGutter Flex-alignCenter gutter"
      >
        <div
          className="InviteLayout-logoContainer"
        >
          <h1
            aria-hidden={true}
            className="LogoHorizontal-hiddenTitle"
          >
            Coral
          </h1>
          <img
            alt=""
            className="LogoHorizontal-base"
            src="logo@2x.png"
          />
        </div>
      </div>
    </div>
  </div>
  <div
    className="Box-root Flex-root Flex-flex Flex-justifyCenter Flex-alignCenter Flex-directionColumn Box-ml-8 Box-mr-8 Box-mt-8 Box-mb-8"
  >
    <div
      className="Box-root HorizontalGutter-root HorizontalGutter-double"
      data-testid="invite-complete-sorry"
    >
      <h1
        className="Box-root Typography-root Typography-heading1 Typography-colorTextPrimary"
      >
        Oops Sorry!
      </h1>
      <div
        className="CallOut-root CallOut-colorError CallOut-fullWidth"
      >
        <div
          className="CallOut-inner"
        >
          <span
            data-testid="invalid-link"
          >
            The specified link is invalid, check to see if it was copied correctly.
          </span>
        </div>
      </div>
    </div>
  </div>
  <p
    className="Box-root Typography-root Typography-detail Typography-colorTextPrimary Version-version"
  >
    vTest
  </p>
</div>
`;
