export const html = `<html>
  <head>
    <title id="page-title">Authorization</title>
    <style>
      body {
        font-family:
          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
          Arial, sans-serif;
        background-color: #f9fafb;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100vh;
        margin: 0;
      }
      .container {
        max-width: 400px;
        padding: 2rem;
        background-color: white;
        border-radius: 0.5rem;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        text-align: center;
        border: 1px solid #e5e7eb;
      }
      .icon {
        border-radius: 9999px;
        width: 48px;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1rem auto;
      }
      .icon.success {
        background-color: #ffe0f7;
        color: #ff00bd;
      }
      .icon.error {
        background-color: #fee2e2;
        color: #dc2626;
      }
      h1 {
        color: #111827;
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
      }
      p {
        color: #6b7280;
        margin-bottom: 1.5rem;
      }
      .error-description {
        background-color: #fef2f2;
        border: 1px solid #fecaca;
        color: #991b1b;
        padding: 1rem;
        border-radius: 0.375rem;
        margin-bottom: 1rem;
        font-size: 0.875rem;
      }
      a {
        color: #d600a0;
        text-decoration: none;
        font-weight: 500;
      }
      a:hover {
        text-decoration: underline;
      }
      button {
        background-color: #ff00bd;
        color: white;
        border: none;
        padding: 0.5rem 1rem;
        border-radius: 0.375rem;
        font-size: 0.875rem;
        cursor: pointer;
      }
      button:hover {
        background-color: #d600a0;
      }
      button.secondary {
        background-color: #6b7280;
        margin-left: 0.5rem;
      }
      button.secondary:hover {
        background-color: #4b5563;
      }
    </style>
  </head>
  <body>
    <div class="container" id="content"></div>

    <script>
      // Parse URL parameters
      const urlParams = new URLSearchParams(window.location.search);
      const error = urlParams.get('error');
      const errorDescription = urlParams.get('error_description');
      const errorUri = urlParams.get('error_uri');
      const code = urlParams.get('code');

      const pageTitle = document.getElementById('page-title');
      const content = document.getElementById('content');

      function createIcon(type) {
        if (type === 'success') {
          return \`
            <div class="icon success">
              <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M5 13L9 17L19 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
              </svg>
            </div>\`;
        } else {
          return \`
            <div class="icon error">
              <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/>
                <line x1="15" y1="9" x2="9" y2="15" stroke="currentColor" stroke-width="2"/>
                <line x1="9" y1="9" x2="15" y2="15" stroke="currentColor" stroke-width="2"/>
              </svg>
            </div>\`;
        }
      }

      function createSupportText() {
        return 'An error occurred during the login process. If the problem continues, please contact our support team at <a href="mailto:support@zuplo.com">support@zuplo.com</a>.';
      }

      if (error) {
        // Handle OAuth error
        pageTitle.textContent = 'Authorization Failed';
        
        content.innerHTML = \`
          \${createIcon('error')}
          <h1>Authorization Failed</h1>
          \${errorDescription ? \`<div class="error-description">\${errorDescription}</div>\` : ''}
          <p>\${createSupportText()}</p>
          <button onclick="window.close()">Close this tab</button>
        \`;
      } else if (code) {
        // Handle successful authorization
        pageTitle.textContent = 'Authorization Successful';
        content.innerHTML = \`
          \${createIcon('success')}
          <h1>Authorization successful</h1>
          <p>Close this tab and return to the Zuplo CLI.</p>
          <button onclick="window.close()">Close this tab</button>
        \`;
      } else {
        // Handle unexpected state (no code, no error)
        pageTitle.textContent = 'Authorization Error';
        
        content.innerHTML = \`
          \${createIcon('error')}
          <h1>Authorization Error</h1>
          <div class="error-description">An unexpected error occurred during the login process.</div>
          <p>\${createSupportText()}</p>
          <button onclick="window.close()">Close this tab</button>
        \`;
      }
    </script>
  </body>
</html>`;
//# sourceMappingURL=html.js.map