@seaverse/auth-sdk 0.3.6 → 0.3.8

package/dist/index.d.ts

@@ -419,6 +419,21 @@ interface SubmitInviteApplicationRequest {
     email: string;
     reason: string;
 }
+/**
+ * Apply invite response (successful submission)
+ */
+interface ApplyInviteResponse {
+    success: boolean;
+    data?: {
+        id: string;
+        email: string;
+        reason: string;
+        status: 'pending' | 'approved' | 'rejected';
+        created_at: string;
+    };
+    code?: string;
+    error?: string;
+}
 /**
  * Invite application list response
  */
@@ -780,6 +795,7 @@ interface BindInviteCodeResponse {
 type models_AccountExistsErrorDetails = AccountExistsErrorDetails;
 type models_ApiError = ApiError;
 type models_ApiServiceTokenResponse = ApiServiceTokenResponse;
+type models_ApplyInviteResponse = ApplyInviteResponse;
 type models_BindInviteCodeRequest = BindInviteCodeRequest;
 type models_BindInviteCodeResponse = BindInviteCodeResponse;
 type models_Container = Container;
@@ -839,7 +855,7 @@ type models_UserInstalledSkillsListResponse = UserInstalledSkillsListResponse;
 type models_VideoDetails = VideoDetails;
 declare namespace models {
   export { models_ErrorCode as ErrorCode };
-  export type { models_AccountExistsErrorDetails as AccountExistsErrorDetails, models_ApiError as ApiError, models_ApiServiceTokenResponse as ApiServiceTokenResponse, models_BindInviteCodeRequest as BindInviteCodeRequest, models_BindInviteCodeResponse as BindInviteCodeResponse, models_Container as Container, models_ContainerDetailResponse as ContainerDetailResponse, models_ContainerListResponse as ContainerListResponse, models_ContainerStatsResponse as ContainerStatsResponse, models_ConversationStatus as ConversationStatus, models_CreateMarketplaceSkillRequest as CreateMarketplaceSkillRequest, models_CreateVideoShareRequest as CreateVideoShareRequest, models_CreateVideoShareResponse as CreateVideoShareResponse, models_EmailVerificationResponse as EmailVerificationResponse, models_ForgotPasswordRequest as ForgotPasswordRequest, models_ForkProjectRequest as ForkProjectRequest, models_ForkProjectResponse as ForkProjectResponse, models_HealthResponse as HealthResponse, models_HubProject as HubProject, models_HubProjectsListResponse as HubProjectsListResponse, models_InviteApplication as InviteApplication, models_InviteApplicationListResponse as InviteApplicationListResponse, models_InviteCode as InviteCode, models_InviteCodeBindRequest as InviteCodeBindRequest, models_InviteCodeDetailResponse as InviteCodeDetailResponse, models_InviteCodeGenerateResponse as InviteCodeGenerateResponse, models_InviteCodeRequiredErrorData as InviteCodeRequiredErrorData, models_InviteCodeVerifyResponse as InviteCodeVerifyResponse, models_InviteStats as InviteStats, models_InviteStatsResponse as InviteStatsResponse, models_InviteUsage as InviteUsage, models_ListInviteUsagesRequest as ListInviteUsagesRequest, models_ListInviteUsagesResponse as ListInviteUsagesResponse, models_ListInvitesRequest as ListInvitesRequest, models_ListInvitesResponse as ListInvitesResponse, models_LoginRequest as LoginRequest, models_LoginResponse as LoginResponse, models_MarketplaceSkill as MarketplaceSkill, models_MarketplaceSkillsListResponse as MarketplaceSkillsListResponse, models_OAuthAuthorizeRequest as OAuthAuthorizeRequest, models_OAuthAuthorizeResponse as OAuthAuthorizeResponse, models_PublishProjectRequest as PublishProjectRequest, models_PublishSkillRequest as PublishSkillRequest, models_RegisterContainerRequest as RegisterContainerRequest, models_RegisterContainerResponse as RegisterContainerResponse, models_RegisterRequest as RegisterRequest, models_RegisterResponse as RegisterResponse, models_ResetPasswordRequest as ResetPasswordRequest, models_SocialMediaLink as SocialMediaLink, models_SocialMediaLinksResponse as SocialMediaLinksResponse, models_SpeechTokenResponse as SpeechTokenResponse, models_SubmitInviteApplicationRequest as SubmitInviteApplicationRequest, models_SuccessResponse as SuccessResponse, models_TrackAppTypeRequest as TrackAppTypeRequest, models_User as User, models_UserInstalledSkill as UserInstalledSkill, models_UserInstalledSkillsListResponse as UserInstalledSkillsListResponse, models_VideoDetails as VideoDetails };
+  export type { models_AccountExistsErrorDetails as AccountExistsErrorDetails, models_ApiError as ApiError, models_ApiServiceTokenResponse as ApiServiceTokenResponse, models_ApplyInviteResponse as ApplyInviteResponse, models_BindInviteCodeRequest as BindInviteCodeRequest, models_BindInviteCodeResponse as BindInviteCodeResponse, models_Container as Container, models_ContainerDetailResponse as ContainerDetailResponse, models_ContainerListResponse as ContainerListResponse, models_ContainerStatsResponse as ContainerStatsResponse, models_ConversationStatus as ConversationStatus, models_CreateMarketplaceSkillRequest as CreateMarketplaceSkillRequest, models_CreateVideoShareRequest as CreateVideoShareRequest, models_CreateVideoShareResponse as CreateVideoShareResponse, models_EmailVerificationResponse as EmailVerificationResponse, models_ForgotPasswordRequest as ForgotPasswordRequest, models_ForkProjectRequest as ForkProjectRequest, models_ForkProjectResponse as ForkProjectResponse, models_HealthResponse as HealthResponse, models_HubProject as HubProject, models_HubProjectsListResponse as HubProjectsListResponse, models_InviteApplication as InviteApplication, models_InviteApplicationListResponse as InviteApplicationListResponse, models_InviteCode as InviteCode, models_InviteCodeBindRequest as InviteCodeBindRequest, models_InviteCodeDetailResponse as InviteCodeDetailResponse, models_InviteCodeGenerateResponse as InviteCodeGenerateResponse, models_InviteCodeRequiredErrorData as InviteCodeRequiredErrorData, models_InviteCodeVerifyResponse as InviteCodeVerifyResponse, models_InviteStats as InviteStats, models_InviteStatsResponse as InviteStatsResponse, models_InviteUsage as InviteUsage, models_ListInviteUsagesRequest as ListInviteUsagesRequest, models_ListInviteUsagesResponse as ListInviteUsagesResponse, models_ListInvitesRequest as ListInvitesRequest, models_ListInvitesResponse as ListInvitesResponse, models_LoginRequest as LoginRequest, models_LoginResponse as LoginResponse, models_MarketplaceSkill as MarketplaceSkill, models_MarketplaceSkillsListResponse as MarketplaceSkillsListResponse, models_OAuthAuthorizeRequest as OAuthAuthorizeRequest, models_OAuthAuthorizeResponse as OAuthAuthorizeResponse, models_PublishProjectRequest as PublishProjectRequest, models_PublishSkillRequest as PublishSkillRequest, models_RegisterContainerRequest as RegisterContainerRequest, models_RegisterContainerResponse as RegisterContainerResponse, models_RegisterRequest as RegisterRequest, models_RegisterResponse as RegisterResponse, models_ResetPasswordRequest as ResetPasswordRequest, models_SocialMediaLink as SocialMediaLink, models_SocialMediaLinksResponse as SocialMediaLinksResponse, models_SpeechTokenResponse as SpeechTokenResponse, models_SubmitInviteApplicationRequest as SubmitInviteApplicationRequest, models_SuccessResponse as SuccessResponse, models_TrackAppTypeRequest as TrackAppTypeRequest, models_User as User, models_UserInstalledSkill as UserInstalledSkill, models_UserInstalledSkillsListResponse as UserInstalledSkillsListResponse, models_VideoDetails as VideoDetails };
 }
 
 /**
@@ -1149,6 +1165,30 @@ declare class SeaVerseBackendAPIClient {
      * console.log('Account activated:', result.data.user);
      */
     bindInviteCode(data: BindInviteCodeRequest, options?: AxiosRequestConfig): Promise<BindInviteCodeResponse>;
+    /**
+     * Submit invite application
+     * Apply for an invitation code by submitting email and reason
+     *
+     * @param data - Invite application request
+     * @param options - Additional axios request options
+     * @returns Application submission response
+     *
+     * @example
+     * // Submit invite application
+     * const result = await client.applyInvite({
+     *   email: 'player@example.com',
+     *   reason: 'I want to join this amazing platform to build innovative applications.'
+     * });
+     *
+     * if (result.success) {
+     *   console.log('Application submitted:', result.data);
+     *   console.log('Application ID:', result.data.id);
+     *   console.log('Status:', result.data.status); // 'pending'
+     * } else {
+     *   console.error('Application failed:', result.error);
+     * }
+     */
+    applyInvite(data: SubmitInviteApplicationRequest, options?: AxiosRequestConfig): Promise<ApplyInviteResponse>;
     /**
      * Google OAuth authorization (Backend Proxy Mode)
      * Generate OAuth authorization URL for Google login
@@ -1285,6 +1325,7 @@ interface AuthModalOptions {
     onLoginSuccess?: (token: string, user: any) => void;
     onSignupSuccess?: (token: string, user: any) => void;
     onInviteCodeRequired?: (userId: string, email: string) => void;
+    onApplyInviteSuccess?: (applicationId: string, email: string) => void;
     onError?: (error: Error) => void;
     theme?: 'dark' | 'light';
     returnUrl?: string;
@@ -1312,7 +1353,7 @@ declare class AuthModal {
     /**
      * Show the authentication modal
      */
-    show(initialView?: 'login' | 'signup' | 'forgot' | 'reset-password' | 'invite-code' | 'message'): void;
+    show(initialView?: 'login' | 'signup' | 'forgot' | 'reset-password' | 'invite-code' | 'apply-invite' | 'message'): void;
     /**
      * Hide the authentication modal
      */
@@ -1329,6 +1370,7 @@ declare class AuthModal {
     private createForgotPasswordForm;
     private createResetPasswordForm;
     private createInviteCodeForm;
+    private createApplyInviteForm;
     private createSuccessMessage;
     private createFormGroup;
     private createPasswordInput;
@@ -1359,6 +1401,7 @@ declare class AuthModal {
     private showSuccess;
     private showError;
     private showWarning;
+    private handleApplyInvite;
     private showInfo;
     /**
      * @deprecated Use showSuccess, showError, showWarning, or showInfo instead
@@ -1480,4 +1523,4 @@ declare class Toast {
 }
 
 export { AuthFactory, AuthModal, AuthProvider, BuiltInHooks, ENVIRONMENT_CONFIGS, ErrorCode, SeaVerseBackendAPIClient, Toast, createAuthModal, detectEnvironment, getEnvironmentConfig, models };
-export type { AccountExistsErrorDetails, ApiError, ApiServiceTokenResponse, AuthModalOptions, AuthModalResult, BindInviteCodeRequest, BindInviteCodeResponse, Container, ContainerDetailResponse, ContainerListResponse, ContainerStatsResponse, ConversationStatus, CreateMarketplaceSkillRequest, CreateVideoShareRequest, CreateVideoShareResponse, EmailVerificationResponse, Environment, EnvironmentConfig, ForgotPasswordRequest, ForkProjectRequest, ForkProjectResponse, HealthResponse, HubProject, HubProjectsListResponse, InviteApplication, InviteApplicationListResponse, InviteCode, InviteCodeBindRequest, InviteCodeDetailResponse, InviteCodeGenerateResponse, InviteCodeRequiredErrorData, InviteCodeVerifyResponse, InviteStats, InviteStatsResponse, InviteUsage, ListInviteUsagesRequest, ListInviteUsagesResponse, ListInvitesRequest, ListInvitesResponse, LoginRequest, LoginResponse, MarketplaceSkill, MarketplaceSkillsListResponse, OAuthAuthorizeRequest, OAuthAuthorizeResponse, PublishProjectRequest, PublishSkillRequest, RegisterContainerRequest, RegisterContainerResponse, RegisterRequest, RegisterResponse, ResetPasswordRequest, RetryOptions, SeaVerseBackendAPIClientOptions, SocialMediaLink, SocialMediaLinksResponse, SpeechTokenResponse, SubmitInviteApplicationRequest, SuccessResponse, ToastOptions, ToastType, TrackAppTypeRequest, User, UserInstalledSkill, UserInstalledSkillsListResponse, VideoDetails };
+export type { AccountExistsErrorDetails, ApiError, ApiServiceTokenResponse, ApplyInviteResponse, AuthModalOptions, AuthModalResult, BindInviteCodeRequest, BindInviteCodeResponse, Container, ContainerDetailResponse, ContainerListResponse, ContainerStatsResponse, ConversationStatus, CreateMarketplaceSkillRequest, CreateVideoShareRequest, CreateVideoShareResponse, EmailVerificationResponse, Environment, EnvironmentConfig, ForgotPasswordRequest, ForkProjectRequest, ForkProjectResponse, HealthResponse, HubProject, HubProjectsListResponse, InviteApplication, InviteApplicationListResponse, InviteCode, InviteCodeBindRequest, InviteCodeDetailResponse, InviteCodeGenerateResponse, InviteCodeRequiredErrorData, InviteCodeVerifyResponse, InviteStats, InviteStatsResponse, InviteUsage, ListInviteUsagesRequest, ListInviteUsagesResponse, ListInvitesRequest, ListInvitesResponse, LoginRequest, LoginResponse, MarketplaceSkill, MarketplaceSkillsListResponse, OAuthAuthorizeRequest, OAuthAuthorizeResponse, PublishProjectRequest, PublishSkillRequest, RegisterContainerRequest, RegisterContainerResponse, RegisterRequest, RegisterResponse, ResetPasswordRequest, RetryOptions, SeaVerseBackendAPIClientOptions, SocialMediaLink, SocialMediaLinksResponse, SpeechTokenResponse, SubmitInviteApplicationRequest, SuccessResponse, ToastOptions, ToastType, TrackAppTypeRequest, User, UserInstalledSkill, UserInstalledSkillsListResponse, VideoDetails };

package/dist/index.js

@@ -1637,6 +1637,43 @@ class SeaVerseBackendAPIClient {
         const response = await this.httpClient.request(config);
         return response.data;
     }
+    /**
+     * Submit invite application
+     * Apply for an invitation code by submitting email and reason
+     *
+     * @param data - Invite application request
+     * @param options - Additional axios request options
+     * @returns Application submission response
+     *
+     * @example
+     * // Submit invite application
+     * const result = await client.applyInvite({
+     *   email: 'player@example.com',
+     *   reason: 'I want to join this amazing platform to build innovative applications.'
+     * });
+     *
+     * if (result.success) {
+     *   console.log('Application submitted:', result.data);
+     *   console.log('Application ID:', result.data.id);
+     *   console.log('Status:', result.data.status); // 'pending'
+     * } else {
+     *   console.error('Application failed:', result.error);
+     * }
+     */
+    async applyInvite(data, options) {
+        const config = {
+            method: 'POST',
+            url: `/sdk/v1/auth/apply-invite`,
+            data,
+            headers: {
+                'X-Operation-Id': 'applyInvite',
+                ...options?.headers,
+            },
+            ...options,
+        };
+        const response = await this.httpClient.request(config);
+        return response.data;
+    }
     // ============================================================================
     // OAuth APIs
     // ============================================================================
@@ -2691,6 +2728,9 @@ class AuthModal {
         // Invite code form
         const inviteCodeForm = this.createInviteCodeForm();
         rightPanel.appendChild(inviteCodeForm);
+        // Apply invite form
+        const applyInviteForm = this.createApplyInviteForm();
+        rightPanel.appendChild(applyInviteForm);
         // Success message
         const successMessage = this.createSuccessMessage();
         rightPanel.appendChild(successMessage);
@@ -3028,21 +3068,37 @@ class AuthModal {
         const container = document.createElement('div');
         container.id = 'inviteCodeForm';
         container.className = 'auth-form-view hidden';
-        // Icon
+        // Icon - 使用星星图标
         const icon = document.createElement('div');
-        icon.className = 'forgot-password-icon';
-        icon.innerHTML = '<div class="icon-glow"></div><svg class="icon-lock" width="56" height="56" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="11" width="14" height="10" rx="2" /><path d="M12 11V7a3 3 0 0 1 3-3h0a3 3 0 0 1 3 3v4" /><circle cx="12" cy="15" r="1" /></svg>';
+        icon.className = 'invite-code-icon';
+        const iconGlow = document.createElement('div');
+        iconGlow.className = 'icon-glow';
+        icon.appendChild(iconGlow);
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        svg.setAttribute('class', 'icon-star');
+        svg.setAttribute('width', '56');
+        svg.setAttribute('height', '56');
+        svg.setAttribute('viewBox', '0 0 24 24');
+        svg.setAttribute('fill', 'none');
+        svg.setAttribute('stroke', 'currentColor');
+        svg.setAttribute('stroke-width', '1.5');
+        svg.setAttribute('stroke-linecap', 'round');
+        svg.setAttribute('stroke-linejoin', 'round');
+        const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+        path.setAttribute('d', 'M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2Z');
+        svg.appendChild(path);
+        icon.appendChild(svg);
         container.appendChild(icon);
         // Header
         const header = document.createElement('div');
         header.className = 'auth-form-header';
         const title = document.createElement('h2');
         title.className = 'auth-form-title';
-        title.textContent = 'Activation Required';
+        title.textContent = 'Bind Invitation Code';
         const subtitle = document.createElement('p');
         subtitle.className = 'auth-form-subtitle';
         subtitle.id = 'inviteCodeSubtitle';
-        subtitle.textContent = 'Enter your invitation code to activate your account';
+        subtitle.textContent = 'Complete your registration by entering an invitation code';
         header.appendChild(title);
         header.appendChild(subtitle);
         container.appendChild(header);
@@ -3050,7 +3106,7 @@ class AuthModal {
         const form = document.createElement('form');
         form.id = 'inviteCodeFormElement';
         form.className = 'auth-form';
-        const codeGroup = this.createFormGroup('inviteCodeInput', 'Invitation Code', 'text', 'Enter invitation code');
+        const codeGroup = this.createFormGroup('inviteCodeInput', 'Invitation code *', 'text', 'Enter your invitation code');
         form.appendChild(codeGroup);
         const submitBtn = document.createElement('button');
         submitBtn.type = 'submit';
@@ -3058,7 +3114,102 @@ class AuthModal {
         submitBtn.className = 'btn-auth-primary';
         const btnText = document.createElement('span');
         btnText.className = 'btn-text';
-        btnText.textContent = 'Activate Account';
+        btnText.textContent = 'Get Started';
+        const btnLoader = document.createElement('span');
+        btnLoader.className = 'btn-loader hidden';
+        const spinnerSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        spinnerSvg.setAttribute('class', 'spinner');
+        spinnerSvg.setAttribute('viewBox', '0 0 24 24');
+        const track = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        track.setAttribute('class', 'spinner-track');
+        track.setAttribute('cx', '12');
+        track.setAttribute('cy', '12');
+        track.setAttribute('r', '10');
+        const circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        circle.setAttribute('class', 'spinner-circle');
+        circle.setAttribute('cx', '12');
+        circle.setAttribute('cy', '12');
+        circle.setAttribute('r', '10');
+        spinnerSvg.appendChild(track);
+        spinnerSvg.appendChild(circle);
+        btnLoader.appendChild(spinnerSvg);
+        submitBtn.appendChild(btnText);
+        submitBtn.appendChild(btnLoader);
+        form.appendChild(submitBtn);
+        container.appendChild(form);
+        // 分隔线
+        const divider = document.createElement('div');
+        divider.className = 'invite-code-divider';
+        divider.textContent = "DON'T HAVE CODE?";
+        container.appendChild(divider);
+        // Apply invite 按钮
+        const applyInviteBtn = document.createElement('button');
+        applyInviteBtn.type = 'button';
+        applyInviteBtn.id = 'showApplyInviteForm';
+        applyInviteBtn.className = 'btn-apply-invite';
+        applyInviteBtn.textContent = 'Apply for access';
+        container.appendChild(applyInviteBtn);
+        return container;
+    }
+    createApplyInviteForm() {
+        const container = document.createElement('div');
+        container.id = 'applyInviteForm';
+        container.className = 'auth-form-view hidden';
+        // Icon
+        const icon = document.createElement('div');
+        icon.className = 'forgot-password-icon';
+        icon.innerHTML = '<div class="icon-glow"></div><svg class="icon-mail" width="56" height="56" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>';
+        container.appendChild(icon);
+        // Header
+        const header = document.createElement('div');
+        header.className = 'auth-form-header';
+        const title = document.createElement('h2');
+        title.className = 'auth-form-title';
+        title.textContent = 'Apply for Invitation Code';
+        const subtitle = document.createElement('p');
+        subtitle.className = 'auth-form-subtitle';
+        subtitle.textContent = 'Tell us why you want to join our platform';
+        header.appendChild(title);
+        header.appendChild(subtitle);
+        container.appendChild(header);
+        // Form
+        const form = document.createElement('form');
+        form.id = 'applyInviteFormElement';
+        form.className = 'auth-form';
+        // Email input
+        const emailGroup = this.createFormGroup('applyInviteEmail', 'Email', 'email', 'Enter your email');
+        form.appendChild(emailGroup);
+        // Reason textarea
+        const reasonGroup = document.createElement('div');
+        reasonGroup.className = 'form-group';
+        const reasonLabel = document.createElement('label');
+        reasonLabel.htmlFor = 'applyInviteReason';
+        reasonLabel.className = 'form-label';
+        reasonLabel.textContent = 'Reason';
+        reasonGroup.appendChild(reasonLabel);
+        const reasonTextarea = document.createElement('textarea');
+        reasonTextarea.id = 'applyInviteReason';
+        reasonTextarea.name = 'reason';
+        reasonTextarea.className = 'form-input';
+        reasonTextarea.placeholder = 'Tell us a bit about yourself and what brings you here...';
+        reasonTextarea.rows = 4;
+        reasonTextarea.required = true;
+        reasonTextarea.minLength = 10;
+        reasonTextarea.maxLength = 500;
+        reasonGroup.appendChild(reasonTextarea);
+        const charCount = document.createElement('div');
+        charCount.className = 'char-count';
+        charCount.textContent = '0/500';
+        reasonGroup.appendChild(charCount);
+        form.appendChild(reasonGroup);
+        // Submit button
+        const submitBtn = document.createElement('button');
+        submitBtn.type = 'submit';
+        submitBtn.id = 'applyInviteButton';
+        submitBtn.className = 'btn-auth-primary';
+        const btnText = document.createElement('span');
+        btnText.className = 'btn-text';
+        btnText.textContent = 'Submit Application';
         const btnLoader = document.createElement('span');
         btnLoader.className = 'btn-loader hidden';
         btnLoader.innerHTML = '<svg class="spinner" viewBox="0 0 24 24"><circle class="spinner-track" cx="12" cy="12" r="10"></circle><circle class="spinner-circle" cx="12" cy="12" r="10"></circle></svg>';
@@ -3071,9 +3222,9 @@ class AuthModal {
         footer.className = 'auth-footer forgot-footer';
         const backLink = document.createElement('a');
         backLink.href = '#';
-        backLink.id = 'backToLoginFromInvite';
+        backLink.id = 'backToInviteCodeFromApply';
         backLink.className = 'back-to-login';
-        backLink.innerHTML = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 12H5M12 19l-7-7 7-7"/></svg><span>Back to Sign In</span>';
+        backLink.innerHTML = '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 12H5M12 19l-7-7 7-7"/></svg><span>Back to Enter Code</span>';
         footer.appendChild(backLink);
         container.appendChild(footer);
         return container;
@@ -3320,6 +3471,16 @@ class AuthModal {
             e.preventDefault();
             this.switchView('login');
         });
+        const showApplyInviteForm = this.modal.querySelector('#showApplyInviteForm');
+        showApplyInviteForm?.addEventListener('click', (e) => {
+            e.preventDefault();
+            this.switchView('apply-invite');
+        });
+        const backToInviteCodeFromApply = this.modal.querySelector('#backToInviteCodeFromApply');
+        backToInviteCodeFromApply?.addEventListener('click', (e) => {
+            e.preventDefault();
+            this.switchView('invite-code');
+        });
         // Password toggle
         const passwordToggles = this.modal.querySelectorAll('.toggle-password');
         passwordToggles.forEach((toggle) => {
@@ -3354,6 +3515,32 @@ class AuthModal {
         resetPasswordForm?.addEventListener('submit', (e) => this.handleResetPassword(e));
         const inviteCodeForm = this.modal.querySelector('#inviteCodeFormElement');
         inviteCodeForm?.addEventListener('submit', (e) => this.handleBindInviteCode(e));
+        const applyInviteForm = this.modal.querySelector('#applyInviteFormElement');
+        applyInviteForm?.addEventListener('submit', (e) => this.handleApplyInvite(e));
+        // Character counter for reason textarea with dynamic progress
+        const reasonTextarea = this.modal.querySelector('#applyInviteReason');
+        const charCount = this.modal.querySelector('.char-count');
+        reasonTextarea?.addEventListener('input', () => {
+            if (charCount) {
+                const length = reasonTextarea.value.length;
+                const maxLength = 500;
+                const percentage = (length / maxLength) * 100;
+                // Update text
+                charCount.textContent = `${length}/${maxLength}`;
+                // Update progress bar width
+                charCount.style.setProperty('--progress-width', `${percentage}%`);
+                // Update progress state
+                if (length < 100) {
+                    charCount.setAttribute('data-progress', 'low');
+                }
+                else if (length < 400) {
+                    charCount.setAttribute('data-progress', 'medium');
+                }
+                else {
+                    charCount.setAttribute('data-progress', 'high');
+                }
+            }
+        });
         // OAuth social login buttons
         this.bindSocialLoginButtons();
     }
@@ -3400,7 +3587,7 @@ class AuthModal {
     switchView(view) {
         if (!this.modal)
             return;
-        const views = ['loginForm', 'signupForm', 'forgotPasswordForm', 'resetPasswordForm', 'inviteCodeForm', 'authMessage'];
+        const views = ['loginForm', 'signupForm', 'forgotPasswordForm', 'resetPasswordForm', 'inviteCodeForm', 'applyInviteForm', 'authMessage'];
         views.forEach((viewId) => {
             const element = this.modal.querySelector(`#${viewId}`);
             element?.classList.add('hidden');
@@ -3411,6 +3598,7 @@ class AuthModal {
             forgot: 'forgotPasswordForm',
             'reset-password': 'resetPasswordForm',
             'invite-code': 'inviteCodeForm',
+            'apply-invite': 'applyInviteForm',
             message: 'authMessage',
         };
         const targetView = this.modal.querySelector(`#${viewMap[view]}`);
@@ -3701,6 +3889,80 @@ class AuthModal {
     showWarning(title, message) {
         Toast.warning(title, message);
     }
+    async handleApplyInvite(e) {
+        e.preventDefault();
+        const emailInput = this.modal?.querySelector('#applyInviteEmail');
+        const reasonTextarea = this.modal?.querySelector('#applyInviteReason');
+        const submitBtn = this.modal?.querySelector('#applyInviteButton');
+        const btnText = submitBtn?.querySelector('.btn-text');
+        const btnLoader = submitBtn?.querySelector('.btn-loader');
+        if (!emailInput || !reasonTextarea || !submitBtn)
+            return;
+        const email = emailInput.value.trim();
+        const reason = reasonTextarea.value.trim();
+        // Validate inputs
+        if (!email) {
+            this.showError('Invalid Input', 'Please enter your email address');
+            return;
+        }
+        if (!reason || reason.length < 10) {
+            this.showError('Invalid Input', 'Please provide a reason (at least 10 characters)');
+            return;
+        }
+        if (reason.length > 500) {
+            this.showError('Invalid Input', 'Reason must be less than 500 characters');
+            return;
+        }
+        try {
+            // Show loading state
+            submitBtn.disabled = true;
+            btnText?.classList.add('hidden');
+            btnLoader?.classList.remove('hidden');
+            // Call applyInvite API
+            const result = await this.client.applyInvite({
+                email,
+                reason,
+            });
+            if (result.success && result.data) {
+                // Success
+                Toast.success('Application Submitted', 'Your invitation code application has been submitted successfully. We will review it and send you an email.');
+                // Trigger callback if provided
+                if (this.options.onApplyInviteSuccess) {
+                    this.options.onApplyInviteSuccess(result.data.id, result.data.email);
+                }
+                // Clear form
+                emailInput.value = '';
+                reasonTextarea.value = '';
+                const charCount = this.modal?.querySelector('.char-count');
+                if (charCount) {
+                    charCount.textContent = '0/500';
+                }
+                // Switch back to login after a delay
+                setTimeout(() => {
+                    this.switchView('login');
+                }, 2000);
+            }
+            else {
+                // Handle business errors (e.g., APPLICATION_DUPLICATE)
+                const errorMessage = result.error || 'Failed to submit application';
+                this.showError('Application Failed', errorMessage);
+            }
+        }
+        catch (error) {
+            // Handle network/server errors
+            const errorMessage = error.response?.data?.error || error.message || 'Failed to submit application';
+            this.showError('Application Failed', errorMessage);
+            if (this.options.onError) {
+                this.options.onError(error);
+            }
+        }
+        finally {
+            // Reset loading state
+            submitBtn.disabled = false;
+            btnText?.classList.remove('hidden');
+            btnLoader?.classList.add('hidden');
+        }
+    }
     showInfo(title, message) {
         Toast.info(title, message);
     }