Events Reference

All events are dispatched as CustomEvent with bubbles: true and composed: true.

Event Map

| Event | Payload | Stage | |-------|---------|-------| | allfeat:ready | { mode } | Initialization | | allfeat:upload-start | { filename, size } | Upload | | allfeat:upload-progress | { progress, loaded, total } | Upload | | allfeat:upload-complete | { filename } | Upload | | allfeat:confirmed | { transactionId } | Confirmation | | allfeat:step | { step, progress, description? } | Tracking | | allfeat:complete | { atsId, txHash, blockNumber, explorerUrl, accessCode? } | Done | | allfeat:failed | { code, message, requestId, details? } | Error | | allfeat:token-expired | { pendingAction } | Auth | | allfeat:error | { code, message, requestId, stage, details? } | Error |

---

allfeat:ready

Fired once when the widget is mounted and initialized.

interface ReadyDetail {
  mode: 'register' | 'update';
}

---

allfeat:upload-start

Fired when the file upload to S3 begins.

interface UploadStartDetail {
  filename: string;
  size: number;  // bytes
}

---

allfeat:upload-progress

Fired repeatedly during file upload.

interface UploadProgressDetail {
  progress: number;  // 0–100
  loaded: number;    // bytes uploaded
  total: number;     // total bytes
}

---

allfeat:upload-complete

Fired when the file upload finishes successfully.

interface UploadCompleteDetail {
  filename: string;
}

---

allfeat:confirmed

Fired when the backend has confirmed the submission and a blockchain transaction is initiated.

interface ConfirmedDetail {
  transactionId: string;
}

---

allfeat:step

Fired on each tracking step transition during blockchain processing.

interface StepDetail {
  step: string;
  progress: number;       // 0–100
  description?: string;   // Human-readable step label
}

Register mode — step order and progress:

| Step | Progress | Description | |------|----------|-------------| | validating | 5% | Validating work data | | transferring_tokens | 20% | Transferring tokens | | preparing_transaction | 40% | Preparing transaction | | signing | 55% | Signing transaction | | submitting | 70% | Submitting to blockchain | | confirming | 85% | Waiting for confirmation | | completed | 100% | Done |

Update mode — step order and progress:

| Step | Progress | Description | |------|----------|-------------| | validating | 5% | Validating work data | | preparing_transaction | 40% | Preparing transaction | | signing | 55% | Signing transaction | | submitting | 70% | Submitting to blockchain | | confirming | 85% | Waiting for confirmation | | completed | 100% | Done |

Note

The transferring_tokens step is only present in register mode. Update mode skips directly from validating to preparing_transaction.

---

allfeat:complete

Fired when the work is successfully registered on the blockchain.

interface CompleteDetail {
  atsId: number | null;   // Unique ATS work identifier
  txHash: string;         // Blockchain transaction hash
  blockNumber: number;    // Block number
  explorerUrl: string;    // Link to blockchain explorer
  accessCode?: string;    // Access code (register mode only)
}

---

allfeat:failed

Fired on critical errors that stop the operation. The widget shows either a FAILED screen (with retry) or a DISABLED screen (no retry, for configuration errors).

interface FailedDetail {
  code: string;                       // Dotted error code (e.g. "session.origin_not_allowed")
  message: string;                    // User-facing error message
  requestId: string | null;           // Backend request ID (null for client-side errors)
  details?: Record<string, unknown>;  // Additional context from backend
}

---

allfeat:token-expired

Fired when a 401 response indicates the JWT token has expired.

interface TokenExpiredDetail {
  pendingAction: string;  // The action that was interrupted
}

After receiving this event, call widget.setToken(newToken) within 60 seconds to resume.

---

allfeat:error

Fired for non-fatal, recoverable errors.

interface ErrorDetail {
  code: string;                       // Dotted error code
  message: string;                    // Human-readable error message
  requestId: string | null;           // Backend request ID (null for client-side errors)
  stage: string;                      // Pipeline stage (e.g. "submit", "upload", "tracking")
  details?: Record<string, unknown>;  // Additional context
}

---

Listening in TypeScript

import { EVENT_NAMES } from 'allfeat-ats-component';
import type { CompleteDetail } from 'allfeat-ats-component';

widget.addEventListener(EVENT_NAMES.COMPLETE, ((e: CustomEvent<CompleteDetail>) => {
  const { atsId, txHash, accessCode } = e.detail;
}) as EventListener);

EVENT_NAMES Constants

const EVENT_NAMES = {
  READY: 'allfeat:ready',
  UPLOAD_START: 'allfeat:upload-start',
  UPLOAD_PROGRESS: 'allfeat:upload-progress',
  UPLOAD_COMPLETE: 'allfeat:upload-complete',
  CONFIRMED: 'allfeat:confirmed',
  STEP: 'allfeat:step',
  COMPLETE: 'allfeat:complete',
  FAILED: 'allfeat:failed',
  TOKEN_EXPIRED: 'allfeat:token-expired',
  ERROR: 'allfeat:error',
};