Through much trial and error, I have found a way to embed my bot into SharePoint without being restricted to an iFrame.
I followed instructions at https://learn.microsoft.com/en-us/microsoft-copilot-studio/customize-default-canvas to create a page with the correct code to render my chatbot, then uploaded it as an ASPX page to SharePoint.
I then used the "Embed" web part to render the ASPX page.
The custom color or the header is correct, but the settings under the constant styleOptions don't seem to be working.
I have the following section in the page for styling (the upload button IS hidden, but the avatar images I'm referencing are not showing)...
const styleOptions = {
// Hide upload button.
hideUploadButton: 'true',
botAvatarBackgroundColor: '#FFFFFF',
botAvatarImage: 'https://myDomain.sharepoint.com/Shared%20Documents/WAlterLogo.png',
userAvatarImage: 'https://avatars.githubusercontent.com/u/661465'
};
For some reason, the botAvatarImage will not display unless I add the property...
botAvatarInitials: 'WA',
I got this working by using...
const styleOptions = {
// Hide upload button.
hideUploadButton: 'true',
botAvatarBackgroundColor: '#FFFFFF',
botAvatarImage: 'https://myDomain.sharepoint.com/Shared%20Documents/WAlterLogo.png',
botAvatarInitials: 'WA',
};