@lukso/transaction-view-headless 0.4.3-dev.a07a66f → 0.4.3

package/dist/registry/index.d.cts

@@ -1,6 +1,6 @@
-export { L as LoaderHelpers, U as UniversalViewLoader, V as ViewLoadingError, g as getGlobalLoader, s as setGlobalLoader } from '../view-loader-D7ApWfdN.cjs';
+export { L as LoaderHelpers, U as UniversalViewLoader, V as ViewLoadingError, g as getGlobalLoader, s as setGlobalLoader } from '../view-loader-dD86QAlQ.cjs';
 import { DecoderResult } from '@lukso/transaction-decoder';
-import { i as ViewRegistry, a as ViewDefinition, h as ViewMatchOptions, b as ViewMatch } from '../view-matching-C9G3z8lQ.cjs';
+import { ViewRegistry, ViewDefinition, ViewMatchOptions, ViewMatch } from '../types/index.cjs';
 
 /**
  * Default view registry implementation

package/dist/registry/index.d.ts

@@ -1,6 +1,6 @@
-export { L as LoaderHelpers, U as UniversalViewLoader, V as ViewLoadingError, g as getGlobalLoader, s as setGlobalLoader } from '../view-loader--mEEI8YY.js';
+export { L as LoaderHelpers, U as UniversalViewLoader, V as ViewLoadingError, g as getGlobalLoader, s as setGlobalLoader } from '../view-loader-ii8AxiQR.js';
 import { DecoderResult } from '@lukso/transaction-decoder';
-import { i as ViewRegistry, a as ViewDefinition, h as ViewMatchOptions, b as ViewMatch } from '../view-matching-C9G3z8lQ.js';
+import { ViewRegistry, ViewDefinition, ViewMatchOptions, ViewMatch } from '../types/index.js';
 
 /**
  * Default view registry implementation

package/dist/types/index.cjs

@@ -3,10 +3,6 @@ var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -19,69 +15,5 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 
 // src/types/index.ts
 var types_exports = {};
-__export(types_exports, {
-  TransactionViewEvents: () => TransactionViewEvents,
-  dispatchHeaderInfo: () => dispatchHeaderInfo,
-  dispatchTransactionModification: () => dispatchTransactionModification,
-  isHeaderInfoEvent: () => isHeaderInfoEvent,
-  isTransactionModificationEvent: () => isTransactionModificationEvent
-});
 module.exports = __toCommonJS(types_exports);
-
-// src/types/view-events.ts
-var TransactionViewEvents = {
-  /**
-   * Emitted when a view wants to provide custom header information
-   * Parent containers should listen for this event and update their header accordingly
-   */
-  HEADER_INFO: "header-info",
-  /**
-   * Emitted when a view modifies its transaction data
-   * Parent containers should listen, re-wrap if needed, and update the transaction
-   */
-  TRANSACTION_MODIFICATION: "transaction-modification",
-  /**
-   * Emitted when a view's state changes (future use)
-   * @example Loading state, error state, interactive state changes
-   */
-  STATE_CHANGE: "view-state-change",
-  /**
-   * Emitted when a view has an action for the user (future use)
-   * @example "Approve", "Reject", "Sign"
-   */
-  ACTION: "view-action"
-};
-function dispatchHeaderInfo(element, headerInfo) {
-  element.dispatchEvent(
-    new CustomEvent(TransactionViewEvents.HEADER_INFO, {
-      bubbles: true,
-      composed: true,
-      // Allows event to cross shadow DOM boundaries
-      detail: headerInfo
-    })
-  );
-}
-function isHeaderInfoEvent(event) {
-  return event instanceof CustomEvent && event.type === TransactionViewEvents.HEADER_INFO;
-}
-function dispatchTransactionModification(element, modification) {
-  element.dispatchEvent(
-    new CustomEvent(TransactionViewEvents.TRANSACTION_MODIFICATION, {
-      bubbles: true,
-      composed: true,
-      detail: modification
-    })
-  );
-}
-function isTransactionModificationEvent(event) {
-  return event instanceof CustomEvent && event.type === TransactionViewEvents.TRANSACTION_MODIFICATION;
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  TransactionViewEvents,
-  dispatchHeaderInfo,
-  dispatchTransactionModification,
-  isHeaderInfoEvent,
-  isTransactionModificationEvent
-});
 //# sourceMappingURL=index.cjs.map

package/dist/types/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/types/index.ts","../../src/types/view-events.ts"],"sourcesContent":["export type {\n  ViewContext,\n  ViewContextRequirements,\n  ViewVariant,\n} from './view-contexts'\nexport type {\n  HeaderInfoEvent,\n  TransactionHeaderInfo,\n  TransactionModification,\n  TransactionModificationEvent,\n  TransactionModificationWithContext,\n} from './view-events'\nexport {\n  dispatchHeaderInfo,\n  dispatchTransactionModification,\n  isHeaderInfoEvent,\n  isTransactionModificationEvent,\n  TransactionViewEvents,\n} from './view-events'\nexport type {\n  DecoderRecordForSelection,\n  FrameworkSupport,\n  FrameworkViewConfig,\n  ViewDefinition,\n  ViewLoader,\n  ViewMatch,\n  ViewMatchCriteria,\n  ViewMatchOptions,\n  ViewRegistry,\n} from './view-matching'\n","/**\n * View Events and Header Information Types\n *\n * Defines the event system for transaction views to communicate\n * with their parent containers about header display and other UI concerns.\n */\n\n/**\n * Header information that a view can provide to its parent container\n *\n * Views can emit this information to override the default header\n * that would be derived from the transaction's top-level from/to addresses.\n *\n * @example\n * ```typescript\n * // Inside a transfer view component\n * this.dispatchEvent(new CustomEvent('header-info', {\n *   bubbles: true,\n *   composed: true,\n *   detail: {\n *     from: transferFromAddress,\n *     to: transferToAddress,\n *     title: 'LSP7 Token Transfer'\n *   }\n * }))\n * ```\n */\nexport interface TransactionHeaderInfo {\n  /**\n   * The \"from\" address to display in the header\n   * Overrides the transaction's top-level from address\n   */\n  from?: string\n\n  /**\n   * The \"to\" address to display in the header\n   * Overrides the transaction's top-level to address\n   */\n  to?: string\n\n  /**\n   * Optional title for the transaction\n   * @example \"LSP7 Token Transfer\", \"Set Data\", \"Execute\"\n   */\n  title?: string\n\n  /**\n   * Optional subtitle or description\n   * @example \"Send 100 tokens\", \"Update profile data\"\n   */\n  subtitle?: string\n\n  /**\n   * Optional icon identifier\n   * @example \"transfer\", \"setdata\", \"execute\"\n   */\n  icon?: string\n\n  /**\n   * Optional additional metadata\n   * Can be used for custom header rendering\n   */\n  metadata?: Record<string, any>\n}\n\n/**\n * Type-safe custom event for header information\n */\nexport interface HeaderInfoEvent extends CustomEvent {\n  detail: TransactionHeaderInfo\n}\n\n/**\n * Transaction modification information\n *\n * Views emit this to modify their transaction's data (e.g., changing a parameter).\n * The view encodes its LOCAL transaction data, and the parent handles re-wrapping\n * if the transaction is inside Execute or ExecuteBatch wrappers.\n *\n * @example\n * ```typescript\n * // In a transfer view, user clicks \"Force Transfer\" checkbox\n * const newData = encodeFunctionData({\n *   abi: LSP7_ABI,\n *   functionName: 'transfer',\n *   args: [from, to, amount, true, data]  // force = true\n * })\n *\n * dispatchTransactionModification(this, {\n *   data: newData,\n *   transactionIndex: this.index,\n *   reason: 'User enabled force transfer to EOA',\n *   userInitiated: true\n * })\n * ```\n */\nexport interface TransactionModification {\n  /**\n   * The modified data for THIS transaction level (not wrapped)\n   *\n   * This is the encoded function call for the current transaction only,\n   * not wrapped in Execute or Batch calls. The parent container handles re-wrapping.\n   */\n  data: `0x${string}`\n\n  /**\n   * The playback index this modification applies to\n   *\n   * - 0 = batch summary (modifies batch itself)\n   * - 1 = first transaction (or single tx)\n   * - 2 = second child transaction\n   * - etc.\n   *\n   * This must match the `index` prop of <transaction-playback>\n   */\n  transactionIndex: number\n\n  /**\n   * Human-readable explanation of why this modification occurred\n   *\n   * @example \"User enabled force transfer to EOA\"\n   * @example \"Slippage tolerance increased to 2%\"\n   * @example \"Gas limit adjusted for complex operation\"\n   */\n  reason: string\n\n  /**\n   * Whether this modification was triggered by user interaction\n   *\n   * - true: User clicked checkbox, changed input, adjusted slider, etc.\n   * - false: Automatic adjustment by view logic\n   */\n  userInitiated: boolean\n\n  /**\n   * Optional structured summary for quick display/logging\n   */\n  summary?: {\n    /** Name of the field that changed */\n    field: string\n\n    /** Human-readable old value */\n    oldValue: string\n\n    /** Human-readable new value */\n    newValue: string\n  }\n\n  /**\n   * Optional validation information\n   */\n  validation?: {\n    /** Whether the modification is valid */\n    isValid: boolean\n\n    /** Error message if invalid */\n    error?: string\n\n    /** Warning messages (modification is valid but user should be aware) */\n    warnings?: string[]\n  }\n}\n\n/**\n * Extended modification info added by transaction-playback\n *\n * This is what the top-level container receives after transaction-playback\n * adds context about where in the transaction tree this modification applies.\n */\nexport interface TransactionModificationWithContext\n  extends TransactionModification {\n  /**\n   * Path from root transaction to this transaction\n   *\n   * @example [1] - Simple transaction at index 1\n   * @example [0, 2] - Batch at index 0, child at index 2\n   * @example [0, 1, 0] - Nested batch: batch[0].children[1].children[0]\n   */\n  transactionPath: number[]\n\n  /**\n   * The full local transaction object with modified data\n   * (Before re-wrapping)\n   */\n  localTransaction: any // DecoderResult, but avoiding circular dep\n\n  /**\n   * Re-decoded result for verification\n   * Parent should verify this decodes successfully before applying\n   */\n  decodedResult: any // DecoderResult\n}\n\n/**\n * Type-safe custom event for transaction modifications\n */\nexport interface TransactionModificationEvent extends CustomEvent {\n  detail: TransactionModification\n}\n\n/**\n * Event type names for transaction views\n */\nexport const TransactionViewEvents = {\n  /**\n   * Emitted when a view wants to provide custom header information\n   * Parent containers should listen for this event and update their header accordingly\n   */\n  HEADER_INFO: 'header-info',\n\n  /**\n   * Emitted when a view modifies its transaction data\n   * Parent containers should listen, re-wrap if needed, and update the transaction\n   */\n  TRANSACTION_MODIFICATION: 'transaction-modification',\n\n  /**\n   * Emitted when a view's state changes (future use)\n   * @example Loading state, error state, interactive state changes\n   */\n  STATE_CHANGE: 'view-state-change',\n\n  /**\n   * Emitted when a view has an action for the user (future use)\n   * @example \"Approve\", \"Reject\", \"Sign\"\n   */\n  ACTION: 'view-action',\n} as const\n\n/**\n * Helper function to dispatch header info event\n * Use this in view components to emit header information\n *\n * @example\n * ```typescript\n * import { dispatchHeaderInfo } from '@lukso/transaction-view-headless'\n *\n * class MyTransferView extends LitElement {\n *   connectedCallback() {\n *     super.connectedCallback()\n *     dispatchHeaderInfo(this, {\n *       from: this.transferFrom,\n *       to: this.transferTo,\n *       title: 'Token Transfer'\n *     })\n *   }\n * }\n * ```\n */\nexport function dispatchHeaderInfo(\n  element: HTMLElement,\n  headerInfo: TransactionHeaderInfo\n): void {\n  element.dispatchEvent(\n    new CustomEvent(TransactionViewEvents.HEADER_INFO, {\n      bubbles: true,\n      composed: true, // Allows event to cross shadow DOM boundaries\n      detail: headerInfo,\n    })\n  )\n}\n\n/**\n * Type guard to check if an event is a HeaderInfoEvent\n */\nexport function isHeaderInfoEvent(event: Event): event is HeaderInfoEvent {\n  return (\n    event instanceof CustomEvent &&\n    event.type === TransactionViewEvents.HEADER_INFO\n  )\n}\n\n/**\n * Helper function to dispatch transaction modification event\n * Use this in view components to emit transaction modifications\n *\n * @example\n * ```typescript\n * import { dispatchTransactionModification } from '@lukso/transaction-view-headless'\n *\n * class MyTransferView extends LitElement {\n *   private handleForceCheckbox(checked: boolean) {\n *     const newData = encodeFunctionData({\n *       abi: LSP7_ABI,\n *       functionName: 'transfer',\n *       args: [...args, checked]\n *     })\n *\n *     dispatchTransactionModification(this, {\n *       data: newData,\n *       transactionIndex: this.index,\n *       reason: 'User enabled force transfer',\n *       userInitiated: true\n *     })\n *   }\n * }\n * ```\n */\nexport function dispatchTransactionModification(\n  element: HTMLElement,\n  modification: TransactionModification\n): void {\n  element.dispatchEvent(\n    new CustomEvent(TransactionViewEvents.TRANSACTION_MODIFICATION, {\n      bubbles: true,\n      composed: true,\n      detail: modification,\n    })\n  )\n}\n\n/**\n * Type guard to check if an event is a TransactionModificationEvent\n */\nexport function isTransactionModificationEvent(\n  event: Event\n): event is TransactionModificationEvent {\n  return (\n    event instanceof CustomEvent &&\n    event.type === TransactionViewEvents.TRANSACTION_MODIFICATION\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AC2MO,IAAM,wBAAwB;AAAA;AAAA;AAAA;AAAA;AAAA,EAKnC,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,EAMb,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA,EAM1B,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA,EAMd,QAAQ;AACV;AAsBO,SAAS,mBACd,SACA,YACM;AACN,UAAQ;AAAA,IACN,IAAI,YAAY,sBAAsB,aAAa;AAAA,MACjD,SAAS;AAAA,MACT,UAAU;AAAA;AAAA,MACV,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AACF;AAKO,SAAS,kBAAkB,OAAwC;AACxE,SACE,iBAAiB,eACjB,MAAM,SAAS,sBAAsB;AAEzC;AA4BO,SAAS,gCACd,SACA,cACM;AACN,UAAQ;AAAA,IACN,IAAI,YAAY,sBAAsB,0BAA0B;AAAA,MAC9D,SAAS;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AACF;AAKO,SAAS,+BACd,OACuC;AACvC,SACE,iBAAiB,eACjB,MAAM,SAAS,sBAAsB;AAEzC;","names":[]}
+{"version":3,"sources":["../../src/types/index.ts"],"sourcesContent":["export type {\n  ViewContext,\n  ViewContextRequirements,\n  ViewVariant,\n} from './view-contexts'\nexport type {\n  DecoderRecordForSelection,\n  FrameworkSupport,\n  FrameworkViewConfig,\n  ViewDefinition,\n  ViewLoader,\n  ViewMatch,\n  ViewMatchCriteria,\n  ViewMatchOptions,\n  ViewRegistry,\n} from './view-matching'\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}

package/dist/types/index.d.cts

@@ -1,263 +1,203 @@
-export { D as DecoderRecordForSelection, F as FrameworkSupport, f as FrameworkViewConfig, V as ViewContext, d as ViewContextRequirements, a as ViewDefinition, g as ViewLoader, b as ViewMatch, c as ViewMatchCriteria, h as ViewMatchOptions, i as ViewRegistry, e as ViewVariant } from '../view-matching-C9G3z8lQ.cjs';
-import '@lukso/transaction-decoder';
+import { DecoderResult } from '@lukso/transaction-decoder';
 
 /**
- * View Events and Header Information Types
+ * Different contexts WHERE transaction views are displayed
  *
- * Defines the event system for transaction views to communicate
- * with their parent containers about header display and other UI concerns.
+ * Context determines the environment/location, which affects:
+ * - Available space
+ * - User intent
+ * - Security requirements
+ * - Interaction patterns
  */
+type ViewContext = 'approval' | 'feed' | 'list' | 'detail' | 'review' | 'notification' | 'embed' | 'batch-summary';
 /**
- * Header information that a view can provide to its parent container
+ * Different variants of HOW transaction views are displayed
  *
- * Views can emit this information to override the default header
- * that would be derived from the transaction's top-level from/to addresses.
- *
- * @example
- * ```typescript
- * // Inside a transfer view component
- * this.dispatchEvent(new CustomEvent('header-info', {
- *   bubbles: true,
- *   composed: true,
- *   detail: {
- *     from: transferFromAddress,
- *     to: transferToAddress,
- *     title: 'LSP7 Token Transfer'
- *   }
- * }))
- * ```
+ * Variant determines the presentation style within a context:
+ * - Same transaction can have different variants in different contexts
+ * - Example: 'collapsed' in feed vs 'collapsed' in approval are different
  */
-interface TransactionHeaderInfo {
-    /**
-     * The "from" address to display in the header
-     * Overrides the transaction's top-level from address
-     */
-    from?: string;
-    /**
-     * The "to" address to display in the header
-     * Overrides the transaction's top-level to address
-     */
-    to?: string;
-    /**
-     * Optional title for the transaction
-     * @example "LSP7 Token Transfer", "Set Data", "Execute"
-     */
-    title?: string;
-    /**
-     * Optional subtitle or description
-     * @example "Send 100 tokens", "Update profile data"
-     */
-    subtitle?: string;
-    /**
-     * Optional icon identifier
-     * @example "transfer", "setdata", "execute"
-     */
-    icon?: string;
-    /**
-     * Optional additional metadata
-     * Can be used for custom header rendering
-     */
-    metadata?: Record<string, any>;
-}
+type ViewVariant = 'full' | 'collapsed' | 'minimal' | 'icon-only' | 'compact' | 'expanded' | string;
 /**
- * Type-safe custom event for header information
+ * Context-specific display requirements
  */
-interface HeaderInfoEvent extends CustomEvent {
-    detail: TransactionHeaderInfo;
+interface ViewContextRequirements {
+    /** Maximum height constraint */
+    maxHeight?: number;
+    /** Whether to show action buttons */
+    showActions?: boolean;
+    /** Level of detail to display */
+    detailLevel: 'minimal' | 'summary' | 'full' | 'debug';
+    /** Whether user can expand for more details */
+    expandable?: boolean;
+    /** Color scheme preference */
+    colorScheme?: 'light' | 'dark' | 'auto';
+    /** Whether to emphasize security warnings */
+    emphasizeSecurity?: boolean;
 }
+
+type DecoderRecordForSelection = DecoderResult & {
+    recordType?: string;
+    functionName?: string;
+    contractAddress?: string;
+    standard?: string;
+};
+
 /**
- * Transaction modification information
- *
- * Views emit this to modify their transaction's data (e.g., changing a parameter).
- * The view encodes its LOCAL transaction data, and the parent handles re-wrapping
- * if the transaction is inside Execute or ExecuteBatch wrappers.
- *
- * @example
- * ```typescript
- * // In a transfer view, user clicks "Force Transfer" checkbox
- * const newData = encodeFunctionData({
- *   abi: LSP7_ABI,
- *   functionName: 'transfer',
- *   args: [from, to, amount, true, data]  // force = true
- * })
- *
- * dispatchTransactionModification(this, {
- *   data: newData,
- *   transactionIndex: this.index,
- *   reason: 'User enabled force transfer to EOA',
- *   userInitiated: true
- * })
- * ```
+ * Criteria that can be used to match transactions to views
  */
-interface TransactionModification {
-    /**
-     * The modified data for THIS transaction level (not wrapped)
+interface ViewMatchCriteria {
+    /** LSP standard (e.g., 'LSP7', 'LSP8', 'LSP0') */
+    standard?: string | string[];
+    /** Function name from ABI (e.g., 'transfer', 'setData', 'execute') */
+    functionName?: string | string[];
+    /** Record type from decoder (e.g., 'lsp7-transfer', 'set-data') */
+    recordType?: string | string[];
+    /** Contract address (for specific contract implementations) */
+    contractAddress?: string | string[];
+    /** Chain ID (for network-specific views) */
+    chainId?: number | number[];
+    /** Display context (opt-in) - WHERE to display (feed, approval, list, etc.) */
+    context?: ViewContext | ViewContext[];
+    /** Display variant (opt-in) - HOW to display (collapsed, minimal, full, etc.) */
+    variant?: ViewVariant | ViewVariant[];
+    /** Context requirements (opt-in) - additional constraints for context matching */
+    contextRequirements?: Partial<ViewContextRequirements>;
+    /**
+     * Custom matcher function for complex synchronous logic.
+     * Returns the number of conditions that matched (higher = better match).
      *
-     * This is the encoded function call for the current transaction only,
-     * not wrapped in Execute or Batch calls. The parent container handles re-wrapping.
-     */
-    data: `0x${string}`;
-    /**
-     * The playback index this modification applies to
+     * IMPORTANT: Must be synchronous and only use data from DecoderResult.
+     * For async operations, populate transaction.custom in an enhancer.
      *
-     * - 0 = batch summary (modifies batch itself)
-     * - 1 = first transaction (or single tx)
-     * - 2 = second child transaction
-     * - etc.
+     * @returns Number of matching conditions (0 = no match, higher = stronger match)
      *
-     * This must match the `index` prop of <transaction-playback>
-     */
-    transactionIndex: number;
-    /**
-     * Human-readable explanation of why this modification occurred
-     *
-     * @example "User enabled force transfer to EOA"
-     * @example "Slippage tolerance increased to 2%"
-     * @example "Gas limit adjusted for complex operation"
-     */
-    reason: string;
-    /**
-     * Whether this modification was triggered by user interaction
-     *
-     * - true: User clicked checkbox, changed input, adjusted slider, etc.
-     * - false: Automatic adjustment by view logic
-     */
-    userInitiated: boolean;
-    /**
-     * Optional structured summary for quick display/logging
-     */
-    summary?: {
-        /** Name of the field that changed */
-        field: string;
-        /** Human-readable old value */
-        oldValue: string;
-        /** Human-readable new value */
-        newValue: string;
-    };
-    /**
-     * Optional validation information
-     */
-    validation?: {
-        /** Whether the modification is valid */
-        isValid: boolean;
-        /** Error message if invalid */
-        error?: string;
-        /** Warning messages (modification is valid but user should be aware) */
-        warnings?: string[];
-    };
+     * @example
+     * // Match token transfers (tokenType === 0)
+     * customMatcher: (tx) => {
+     *   let matches = 0
+     *   if (tx.custom?.tokenType === 0) matches++
+     *   if (BigInt(tx.value || 0) > 0) matches++
+     *   return matches
+     * }
+     */
+    customMatcher?: (transaction: DecoderResult) => number;
 }
 /**
- * Extended modification info added by transaction-playback
- *
- * This is what the top-level container receives after transaction-playback
- * adds context about where in the transaction tree this modification applies.
+ * Framework-agnostic view definition
  */
-interface TransactionModificationWithContext extends TransactionModification {
-    /**
-     * Path from root transaction to this transaction
-     *
-     * @example [1] - Simple transaction at index 1
-     * @example [0, 2] - Batch at index 0, child at index 2
-     * @example [0, 1, 0] - Nested batch: batch[0].children[1].children[0]
-     */
-    transactionPath: number[];
-    /**
-     * The full local transaction object with modified data
-     * (Before re-wrapping)
-     */
-    localTransaction: any;
-    /**
-     * Re-decoded result for verification
-     * Parent should verify this decodes successfully before applying
-     */
-    decodedResult: any;
+interface ViewDefinition {
+    /** Unique identifier for this view */
+    id: string;
+    /** Human-readable name */
+    name: string;
+    /** Criteria for matching transactions to this view */
+    criteria: ViewMatchCriteria;
+    /** Priority when multiple views match (higher = preferred) */
+    priority: number;
+    /** Supported frameworks for this view */
+    frameworks: FrameworkSupport;
+    /** Optional description */
+    description?: string;
 }
 /**
- * Type-safe custom event for transaction modifications
+ * Framework-specific loading configurations
+ *
+ * Strategic Framework Selection (Suffering Economics Optimized):
+ * - lit: Universal web components (works in Vue, React, Angular, Svelte, etc.)
+ * - vue: Native Vue components (optional, for Vue-specific optimizations)
+ * - rn: React Native components (mobile-native, optional - falls back to WebView)
+ *
+ * Lit is the universal fallback. Vue and React Native are optional native implementations
+ * that get priority when available in their respective environments.
  */
-interface TransactionModificationEvent extends CustomEvent {
-    detail: TransactionModification;
+interface FrameworkSupport {
+    lit: FrameworkViewConfig;
+    vue?: FrameworkViewConfig;
+    rn?: FrameworkViewConfig;
 }
 /**
- * Event type names for transaction views
+ * Configuration for loading a view in a specific framework
  */
-declare const TransactionViewEvents: {
-    /**
-     * Emitted when a view wants to provide custom header information
-     * Parent containers should listen for this event and update their header accordingly
-     */
-    readonly HEADER_INFO: "header-info";
-    /**
-     * Emitted when a view modifies its transaction data
-     * Parent containers should listen, re-wrap if needed, and update the transaction
-     */
-    readonly TRANSACTION_MODIFICATION: "transaction-modification";
-    /**
-     * Emitted when a view's state changes (future use)
-     * @example Loading state, error state, interactive state changes
-     */
-    readonly STATE_CHANGE: "view-state-change";
-    /**
-     * Emitted when a view has an action for the user (future use)
-     * @example "Approve", "Reject", "Sign"
-     */
-    readonly ACTION: "view-action";
-};
+interface FrameworkViewConfig {
+    /** Loading method */
+    loader: ViewLoader;
+    /** Component name/identifier */
+    component: string;
+    /** Package where the component is located */
+    package?: string;
+}
 /**
- * Helper function to dispatch header info event
- * Use this in view components to emit header information
- *
- * @example
- * ```typescript
- * import { dispatchHeaderInfo } from '@lukso/transaction-view-headless'
+ * Different ways to load a view component
  *
- * class MyTransferView extends LitElement {
- *   connectedCallback() {
- *     super.connectedCallback()
- *     dispatchHeaderInfo(this, {
- *       from: this.transferFrom,
- *       to: this.transferTo,
- *       title: 'Token Transfer'
- *     })
- *   }
- * }
- * ```
+ * Loaders support both static and lazy loading:
+ * - Static: `path: './Component.vue'` - bundled with app
+ * - Lazy: `path: () => import('./Component.vue')` - loaded on demand
  */
-declare function dispatchHeaderInfo(element: HTMLElement, headerInfo: TransactionHeaderInfo): void;
+type ViewLoader = {
+    type: 'dynamic-import';
+    path: string | (() => Promise<any>);
+} | {
+    type: 'static-import';
+    path: string | (() => Promise<any>);
+} | {
+    type: 'custom-element';
+    tagName: string;
+} | {
+    type: 'registry-lookup';
+    registryKey: string;
+} | {
+    type: 'custom';
+    loader: (config: FrameworkViewConfig) => Promise<any>;
+};
 /**
- * Type guard to check if an event is a HeaderInfoEvent
+ * Result of matching a transaction against registered views
  */
-declare function isHeaderInfoEvent(event: Event): event is HeaderInfoEvent;
+interface ViewMatch {
+    /** The view definition that matched */
+    view: ViewDefinition;
+    /** Score indicating how well this view matches (0-1) */
+    score: number;
+    /** Which criteria matched */
+    matchedCriteria: (keyof ViewMatchCriteria)[];
+    /** Framework-specific loading config */
+    frameworkConfig?: FrameworkViewConfig;
+}
 /**
- * Helper function to dispatch transaction modification event
- * Use this in view components to emit transaction modifications
- *
- * @example
- * ```typescript
- * import { dispatchTransactionModification } from '@lukso/transaction-view-headless'
- *
- * class MyTransferView extends LitElement {
- *   private handleForceCheckbox(checked: boolean) {
- *     const newData = encodeFunctionData({
- *       abi: LSP7_ABI,
- *       functionName: 'transfer',
- *       args: [...args, checked]
- *     })
- *
- *     dispatchTransactionModification(this, {
- *       data: newData,
- *       transactionIndex: this.index,
- *       reason: 'User enabled force transfer',
- *       userInitiated: true
- *     })
- *   }
- * }
- * ```
+ * Options for view matching
  */
-declare function dispatchTransactionModification(element: HTMLElement, modification: TransactionModification): void;
+interface ViewMatchOptions {
+    /** Target framework */
+    framework: 'lit' | 'vue' | 'rn';
+    /** Display context (optional) - WHERE to display (feed, approval, list, etc.) */
+    context?: ViewContext;
+    /** Display variant (optional) - HOW to display (collapsed, minimal, full, etc.) */
+    variant?: ViewVariant;
+    /** Context requirements (optional) - additional constraints for context-aware matching */
+    contextRequirements?: Partial<ViewContextRequirements>;
+    /** Minimum score threshold (0-1) */
+    minScore?: number;
+    /** Maximum number of matches to return */
+    maxMatches?: number;
+    /** Whether to include framework config in results */
+    includeFrameworkConfig?: boolean;
+}
 /**
- * Type guard to check if an event is a TransactionModificationEvent
+ * Registry for managing view definitions
  */
-declare function isTransactionModificationEvent(event: Event): event is TransactionModificationEvent;
+interface ViewRegistry {
+    /** Register a new view */
+    register(view: ViewDefinition): void;
+    /** Unregister a view by ID */
+    unregister(viewId: string): void;
+    /** Get all registered views */
+    getAllViews(): ViewDefinition[];
+    /** Find best matching views for a transaction */
+    findMatches(transaction: DecoderResult, options: ViewMatchOptions): ViewMatch[];
+    /** Get a specific view by ID */
+    getView(viewId: string): ViewDefinition | undefined;
+    /** Clear all registered views */
+    clear(): void;
+}
 
-export { type HeaderInfoEvent, type TransactionHeaderInfo, type TransactionModification, type TransactionModificationEvent, type TransactionModificationWithContext, TransactionViewEvents, dispatchHeaderInfo, dispatchTransactionModification, isHeaderInfoEvent, isTransactionModificationEvent };
+export type { DecoderRecordForSelection, FrameworkSupport, FrameworkViewConfig, ViewContext, ViewContextRequirements, ViewDefinition, ViewLoader, ViewMatch, ViewMatchCriteria, ViewMatchOptions, ViewRegistry, ViewVariant };