Demo
Para probar este Brick deberá utilizar unas credenciales válidas modificando el código.
React
import { CIQuoteForm } from '@comparaonline/ci-quote/react'; import { useEffect, useState } from 'react'; import '@comparaonline/ci-quote/css'; const ENVIRONMENT = 'production'; export default function App() { const environment = ENVIRONMENT === 'staging' ? 'staging' : 'production'; const baseUrl = environment === 'staging' ? 'https://cotizador-staging.comparaonline.com' : 'https://cotizador.comparaonline.com'; const [CIQuoteConfig, setCIQuoteConfig] = useState({ lang: 'es', environment, }); useEffect(() => { (async () => { const res = await fetch(baseUrl + '/octopus-prime/auth/login', { method: 'POST', headers: { Accept: 'application/json', 'Content-Type': 'application/json', 'Requesting-App': 'brick', }, body: JSON.stringify({ username: 'not-a-valid-user', password: 'not-a-valid-password', }), }); const data = await res.json(); setCIQuoteConfig((prevConfig) => ({ ...prevConfig, ...data, environment, theme: { mode: 'undefined', }, })); })(); }, [baseUrl, environment]); return <CIQuoteForm {...CIQuoteConfig} />; }
Otros casos de uso
<!DOCTYPE html> <html> <head> <title>My application title</title> <meta charset="UTF-8" /> <link rel="stylesheet" href="https://bricks.comparaonline.com/ci-quote/style.css" /> <script type="module" src="https://bricks.comparaonline.com/ci-quote/index.mjs"></script> <style> body { margin: 0; } </style> </head> <body> <main id="root"></main> <script src="./index.js"></script> </body> </html>