@passkey-fas/element/src/fas-element.d.ts

FaS Element - Web component cung cấp UI tiếng Việt đẹp cho xác thực passkey, dễ dàng tích hợp vào website

export interface FaSAuthResult {
  success: boolean;
  user: {
    id: string;
    email: string;
    fullname?: string;
    lastLogin: string;
  };
  token: string;
}

export interface FaSSuccessEventDetail {
  type: 'login' | 'register' | 'quick-login';
  user: FaSAuthResult['user'];
  token: string;
}

export interface FaSErrorEventDetail {
  message: string;
}

export interface FaSElementAttributes {
  'api-url'?: string;
  'client-id'?: string;
  'client-secret'?: string;
  'use-proxy'?: string;
  'theme'?: string;
  'lang'?: string;
}

export declare class FaSElement extends HTMLElement {
  constructor();
  
  // Properties
  apiUrl: string;
  clientId: string;
  clientSecret: string;
  useProxy: boolean;
  loading: boolean;
  currentStep: 'login' | 'register' | 'success' | 'register-success' | 'error';
  authData: FaSAuthResult | null;
  
  // Methods
  reset(): void;
  getAuthData(): FaSAuthResult | null;
  
  // Event handlers
  addEventListener(type: 'fas-success', listener: (event: CustomEvent<FaSSuccessEventDetail>) => void): void;
  addEventListener(type: 'fas-error', listener: (event: CustomEvent<FaSErrorEventDetail>) => void): void;
  addEventListener(type: string, listener: EventListenerOrEventListenerObject): void;
}

// Global element registration
declare global {
  interface HTMLElementTagNameMap {
    'fas-element': FaSElement;
  }
  
  namespace JSX {
    interface IntrinsicElements {
      'fas-element': FaSElementAttributes & React.DetailedHTMLProps<React.HTMLAttributes<FaSElement>, FaSElement>;
    }
  }
}

export default FaSElement;