From 4c9fc8ce70287aac8895d19d8db0fd9868d557ae Mon Sep 17 00:00:00 2001
From: Yaozu Lv <yaozulv@tencent.com>
Date: Wed, 1 Apr 2026 12:00:00 +0800
Subject: [PATCH] Add record option maskInputFn for custom mask input function
 (#409)

---
 src/record/index.ts    | 2 ++
 src/record/observer.ts | 9 ++++++++-
 src/types.ts           | 4 ++++
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/record/index.ts b/src/record/index.ts
index 9beddd9f..149c2cf6 100644
--- a/src/record/index.ts
+++ b/src/record/index.ts
@@ -37,6 +37,7 @@ function record<T = eventWithTime>(
     inlineStylesheet = true,
     maskAllInputs,
     maskInputOptions: _maskInputOptions,
+    maskInputFn,
     hooks,
     packFn,
     sampling = {},
@@ -293,6 +294,7 @@ function record<T = eventWithTime>(
             blockClass,
             ignoreClass,
             maskInputOptions,
+            maskInputFn,
             inlineStylesheet,
             sampling,
             recordCanvas,
diff --git a/src/record/observer.ts b/src/record/observer.ts
index a557ce92..74259609 100644
--- a/src/record/observer.ts
+++ b/src/record/observer.ts
@@ -35,6 +35,7 @@ import {
   canvasMutationCallback,
   fontCallback,
   fontParam,
+  MaskInputFn,
 } from '../types';
 import MutationBuffer from './mutation';
 
@@ -223,6 +224,7 @@ function initInputObserver(
   blockClass: blockClass,
   ignoreClass: string,
   maskInputOptions: MaskInputOptions,
+  maskInputFn: MaskInputFn | undefined,
   sampling: SamplingStrategy,
 ): listenerHandler {
   function eventHandler(event: Event) {
@@ -252,7 +254,11 @@ function initInputObserver(
       ] ||
       maskInputOptions[type as keyof MaskInputOptions]
     ) {
-      text = '*'.repeat(text.length);
+      if(maskInputFn) {
+        text = maskInputFn(text)
+      } else {
+        text = '*'.repeat(text.length);
+      }
     }
     cbWithDedup(target, { text, isChecked });
     // if a radio was checked
@@ -593,6 +599,7 @@ export function initObservers(
     o.blockClass,
     o.ignoreClass,
     o.maskInputOptions,
+    o.maskInputFn,
     o.sampling,
   );
   const mediaInteractionHandler = initMediaInteractionObserver(
diff --git a/src/types.ts b/src/types.ts
index c68069fa..2beba8dc 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -174,6 +174,7 @@ export type recordOptions<T> = {
   ignoreClass?: string;
   maskAllInputs?: boolean;
   maskInputOptions?: MaskInputOptions;
+  maskInputFn?: MaskInputFn;
   inlineStylesheet?: boolean;
   hooks?: hooksParam;
   packFn?: PackFn;
@@ -195,6 +196,7 @@ export type observerParam = {
   blockClass: blockClass;
   ignoreClass: string;
   maskInputOptions: MaskInputOptions;
+  maskInputFn?: MaskInputFn;
   inlineStylesheet: boolean;
   styleSheetRuleCb: styleSheetRuleCallback;
   canvasMutationCb: canvasMutationCallback;
@@ -461,3 +463,5 @@ export enum ReplayerEvents {
   Flush = 'flush',
   StateChange = 'state-change',
 }
+
+export type MaskInputFn = (text: string) => string;