A plug and play embedded widget for Authentic's Insurance Portal.
Add the following script tag to the <head> of your index.html file.
<script type="module" src="https://www.unpkg.com/@authenticins/widget@latest/dist/authenticWidget.js"></script>Once installed, the widget script will expose controls to the browser window.
You can configure the widget's look and behavior on initialization (see the full WidgetConfig definition below).
<script>
window.addEventListener("load", () => {
window.authenticWidget.init({
insurancePortal: { url: "https://example-tenant-name.prod.authenticinsurance.com" },
prefillData: {
lead: { email: "johndoe@email.com" }
},
themeOverrides: {
primaryColor: "#000000",
borderRadiusPx: 6,
brand: {
name: "Example Tenant Name",
logoUrls: {
darkBg: "https://example-tenant-website.com/logo-white.png",
lightBg: "https://example-tenant-website.com/logo-black.png"
},
faviconUrl: "https://example-tenant-website.com/favicon.ico"
}
}
});
});
</script>interface WidgetConfig {
insurancePortal?: {
url?: string;
// The CSS selector for the target element you want the Insurance Portal injected into.
// If no target selector is provided, the widget will inject its default persistent banner and modal.
targetSelector?: string;
};
customerId?: string;
prefillData?: {
lead?: {
email?: string;
businessClassCode?: string;
stateCodes?: string[];
productIds?: string[];
};
responses?: {
exposures?: Array<{
id: number;
exposureName: string;
// Where each key is a field's name mapped to its value (e.g. ['BUSINESS_LEGAL_NAME']: 'Example Business Name');
fieldValues: Record<string, string>;
}>;
// Same as format described above.
questions?: Record<string, string>;
};
};
themeOverrides?: {
useDarkMode?: boolean;
primaryColor?: string;
secondaryColor?: string;
borderRadiusPx?: number;
brand?: {
name?: string;
logoUrls?: {
darkBg?: string;
lightBg?: string;
};
faviconUrl?: string;
};
};
}