import React, { FC } from 'react'; import './index.scss'; interface PntSecureBoxProps { /** * 高敏信息的唯一标识 key * @description 用于标识和存储特定的高敏数据项 */ dataKey: string; /** * 高敏信息的实际值 * @description 初始显示的值,通常为脱敏后的数据 */ dataValue: string; /** * 环境标识 * @description 用于区分不同环境(如:dev, test, production);可缺省,默认 0 */ env?: string | number; /** * 游戏 ID * @description 标识具体的游戏项目 */ gameId: string | number; /** * 自定义渲染函数 * @description 接收处理后的数据作为参数,返回需要渲染的 React 元素 * @param content - 处理后的数据内容(真实数据或脱敏数据) * @returns React 元素 */ renderDom: (content: string) => React.ReactNode; /** * 自定义查看按钮文案 * @description 用于适配多语言场景,默认为 'View' */ viewText?: string; /** * 页面 ID * @description 用于记录操作日志和权限验证 */ pageId?: string; /** * 明文是否也掩码显示 * @description * - false(默认):非加密值直接展示原值 * - true:非加密值也展示 ******,点击后本地揭示(不调接口,防窥屏) */ maskPlain?: boolean; /** * 接口变体 * @description * - 'business'(默认):业务级,走 /v3/business/game_info/high-security-decrypt * - 'platform':平台级(发布记录页等场景),走 /v3/business/game_info/plat-high-security-decrypt */ scope?: 'business' | 'platform'; /** * 解锁后是否显示复制按钮 * @description 默认 true,解锁后按钮文案切换为「复制」;传 false 则解锁后按钮消失(旧行为) */ copyable?: boolean; /** * 复制按钮文案 * @description 用于适配多语言场景,默认为 'Copy' */ copyText?: string; /** * 复制成功后的内联提示文案 * @description 仅在使用默认复制(未传 onCopy)时生效; * 传入非空字符串后,复制成功按钮文案临时切换为该文案 2 秒;默认 'Copied',传 '' 关闭内联提示 */ copySuccessText?: string; /** * 自定义复制行为 * @description 传入后替换默认的 navigator.clipboard.writeText; * 消费方自行处理复制与反馈(此时 copySuccessText 不再生效) */ onCopy?: (value: string) => void | Promise; /** * securityData 变化回调 * @description 当 securityData 变化时触发(包括解密成功后); * 回调参数为当前 gameId+env 下的整个 securityData 对象(key 为字段名,value 为明文); * 消费方可用于同步表单字段、调试等 */ onSecurityDataChange?: (securityData: Record) => void; } /** * 高敏信息展示统一组件 * @description 用于统一处理和展示高敏信息,支持脱敏显示、按需获取真实数据、解锁后复制。 * 通过 PntProvider 注入 http 实例,对接 `/api/v3/business/game_info/high-security-decrypt`。 * * @param {PntSecureBoxProps} props - 组件属性 * @param {string} props.dataKey - 高敏信息的唯一标识 key * @param {string} props.dataValue - 高敏信息的实际值 * @param {string | number} props.env - 环境标识 * @param {string | number} props.gameId - 游戏 ID * @param {(content: string) => React.ReactNode} props.renderDom - 自定义渲染函数 * @param {string} [props.viewText] - 自定义查看按钮文案 * @param {string} [props.pageId] - 页面 ID * @param {boolean} [props.copyable=true] - 解锁后是否显示复制按钮 * @param {string} [props.copyText] - 复制按钮文案 * @param {string} [props.copySuccessText] - 复制成功内联提示文案 * @param {(value: string) => void | Promise} [props.onCopy] - 自定义复制行为 * * @example * ```tsx * import { PntSecureBox } from '@pnt-team/pnt-component-frontend'; * * {content}} * viewText="查看" * copyText="复制" * copySuccessText="已复制" * /> * ``` * * @returns {ReactElement} 高敏信息展示组件 */ declare const PntSecureBox: FC; export default PntSecureBox;