import styles from '../../../assets/index.css';
import { Bot, BotProps } from '@/components/Bot';
import { BubbleParams } from '@/features/bubble/types';
import { createSignal, onCleanup, onMount, Show } from 'solid-js';
const defaultButtonColor = '#3B81F6';
const defaultIconColor = 'white';
export type FullProps = BotProps & BubbleParams;
export const Full = (props: FullProps, { element }: { element: HTMLElement }) => {
const [isBotDisplayed, setIsBotDisplayed] = createSignal(false);
const launchBot = () => {
setIsBotDisplayed(true);
document.body.style.margin = '0'; // Ensure no margin
document.documentElement.style.padding = '0'; // Ensure no padding
// Set viewport meta tag dynamically
const viewportMeta = document.querySelector('meta[name="viewport"]');
if (viewportMeta) {
viewportMeta.setAttribute('content', 'width=device-width, initial-scale=1.0, interactive-widget=resizes-content');
}
};
const botLauncherObserver = new IntersectionObserver((intersections) => {
if (intersections.some((intersection) => intersection.isIntersecting)) launchBot();
});
onMount(() => {
botLauncherObserver.observe(element);
});
onCleanup(() => {
botLauncherObserver.disconnect();
document.body.style.margin = ''; // Reset margin
document.documentElement.style.padding = ''; // Reset padding
// Reset viewport meta tag if needed
const viewportMeta = document.querySelector('meta[name="viewport"]');
if (viewportMeta) {
viewportMeta.setAttribute('content', 'width=device-width, initial-scale=1.0');
}
});
return (
<>
);
};