Opciones de Configuración Personalizada
La sección de Configuración permite a los desarrolladores personalizar el Web SDK pasando opciones al wrapper SequenceConnect
.
Los desarrolladores pueden personalizar la experiencia del Web SDK pasando opciones de configuración al wrapper SequenceConnect
.
Así es como puede configurar el kit usando estas opciones:
Resumen de Configuración
A continuación se muestran las opciones disponibles para personalizar la configuración, o, vea abajo todas las opciones en detalle:
Estilo y Diseño Personalizados
Puede personalizar la apariencia visual del modal de conexión del Web SDK proporcionando un objeto de tema personalizado a la opción de configuración defaultTheme
. Aquí tiene un ejemplo de cómo implementar un estilo personalizado:
Variables de Tema Disponibles
Las siguientes variables de tema pueden ser personalizadas:
Puede sobrescribir cualquier combinación de estas variables para crear su propio tema. Los valores pueden proporcionarse en cualquier formato de color CSS válido (rgba, hex, nombres de colores, etc.).
Opciones Disponibles
Desarrollo de Apps con Sequence
appName
Type | Predeterminado |
---|---|
string | indefinido |
Un valor interno de nombre de software que no se muestra al usuario.
projectAccessKey
Type | Predeterminado |
---|---|
string | indefinido |
La clave de acceso del proyecto que se requiere, obtenida desde Sequence Builder
ethAuth
como EthAuthSettings
waasConfigKey
Type | Predeterminado |
---|---|
string | indefinido |
La clave de configuración de Embedded Wallet requerida para wallets WaaS, configurada dentro de Sequence Builder.
Red
chainIds
Type | Predeterminado |
---|---|
number[] | indefinido |
Una lista de IDs de cadena. Ejemplo: [1, 137]
defaultChainId
Type | Predeterminado |
---|---|
number | indefinido |
El ID de cadena que se usa primero para firmas y transacciones.
UI
Parámetros de la interfaz de usuario que modifican el modal.
Configuración del Modal de Inicio de Sesión (signIn
)
El objeto signIn
se utiliza para configurar el modal de inicio de sesión.
signIn.logoUrl
Type | Predeterminado |
---|---|
string | indefinido |
URL del logo que se mostrará en el modal de inicio de sesión.
signIn.projectName
Type | Predeterminado |
---|---|
string | indefinido |
Nombre del proyecto que se mostrará en el modal de inicio de sesión.
signIn.useMock
Type | Predeterminado |
---|---|
boolean | indefinido |
Elimina la capacidad de hacer solicitudes reales a blockchain si se establece en true
usando el conector mock de wagmi
position
Type | Predeterminado |
---|---|
string | center |
El parámetro position determina la ubicación de los diferentes modales en la pantalla. Los valores posibles incluyen:
- center
- middle-right
- middle-left
- top-center
- top-right
- top-left
- bottom-center
- bottom-right
- bottom-left
defaultTheme
Type | Predeterminado |
---|---|
string u objeto | dark |
El defaultTheme determina la paleta de colores utilizada para el estilo del modal. Los valores posibles incluyen:
- ‘light’
- ‘dark’
- object
Colores específicos pueden sobrescribirse pasando un objeto de tema personalizado. El Sequence Builder ofrece un playground útil para probar los colores en Web SDK.
Wallet
Parámetros que incluyen opciones de configuración de wallet
disableAnalytics
Type | Predeterminado |
---|---|
boolean | indefinido |
Activa o desactiva la función de analytics conectada a tu proyecto en Sequence Builder.
displayedAssets
Type | Predeterminado |
---|---|
[{ contractAddress: string, chainId: number }, …] | indefinido |
Si se proporciona, esto determinará qué activos se mostrarán en la vista principal del modal de wallet dentro del juego. Al pasar una lista de activos, solo los activos de la lista se mostrarán en la vista principal. Si no se proporcionan activos, todos los activos propios pueden mostrarse en la vista principal.
enableConfirmationModal
Type | Predeterminado |
---|---|
boolean | indefinido |
Habilita confirmaciones al enviar transacciones
Proveedores de inicio de sesión
Los diferentes proveedores de inicio de sesión que crean conexiones de wallet para el usuario:
walletConnect
Type | Predeterminado | |
---|---|---|
false | { projectId: string } | undefined |
google
Type | Predeterminado | |
---|---|---|
false | { clientId: string } | undefined |
apple
Type | Predeterminado | |
---|---|---|
false | { clientId: string, redirectURI: string } | undefined |
email
Type | Predeterminado | |
---|---|---|
boolean | { legacyEmailAuth: boolean } | undefined |
Crear conectores universales predeterminados
Aunque generalmente recomendamos usar Embedded Wallets con SequenceKit, como alternativa, también puede utilizar nuestra configuración Universal Wallet. Al crear una variable connectors
de wagmi, importe la función getDefaultConnectors
del paquete @0xsequence/kit
, e incluya un Wallet Connect ID obtenido aquí, un chain ID predeterminado, el nombre de la app y el projectAccessKey
, luego continúe con la integración desde el inicio rápido.