diff --git a/.changeset/mobile-assistant-fullscreen.md b/.changeset/mobile-assistant-fullscreen.md new file mode 100644 index 0000000..be182d2 --- /dev/null +++ b/.changeset/mobile-assistant-fullscreen.md @@ -0,0 +1,7 @@ +--- +"@silicajs/assistant": patch +"@silicajs/core": patch +"@silicajs/theme-amethyst": patch +--- + +Open the assistant fullscreen on mobile and close the mobile sidebar before showing it. diff --git a/packages/assistant/src/ui/trigger.tsx b/packages/assistant/src/ui/trigger.tsx index 2b15055..02f89d0 100644 --- a/packages/assistant/src/ui/trigger.tsx +++ b/packages/assistant/src/ui/trigger.tsx @@ -15,16 +15,23 @@ export type AssistantTriggerProps = { className?: string; label?: string; iconOnly?: boolean; + onOpen?: () => void; }; export function AssistantTrigger({ className, label = "Ask AI", iconOnly = false, + onOpen, }: AssistantTriggerProps) { const assistant = useAssistant(); const setOpen = assistant?.setOpen; + const openAssistant = React.useCallback(() => { + onOpen?.(); + assistant?.setOpen(true); + }, [assistant, onOpen]); + React.useEffect(() => { if (!setOpen) return; const onKeyDown = (event: KeyboardEvent) => { @@ -49,7 +56,7 @@ export function AssistantTrigger({ type="button" variant="outline" size="icon-sm" - onClick={() => assistant.setOpen(true)} + onClick={openAssistant} className={className} > @@ -70,7 +77,7 @@ export function AssistantTrigger({ type="button" variant="outline" size="sm" - onClick={() => assistant.setOpen(true)} + onClick={openAssistant} className={className} > void; }) => React.ReactNode; /** * The assistant chat window (conversation + composer). Fills its diff --git a/packages/theme-amethyst/src/assistant-dock.tsx b/packages/theme-amethyst/src/assistant-dock.tsx index f196926..e78ae11 100644 --- a/packages/theme-amethyst/src/assistant-dock.tsx +++ b/packages/theme-amethyst/src/assistant-dock.tsx @@ -47,7 +47,7 @@ export function AssistantDock({ panel, children }: AssistantDockProps) { AI assistant diff --git a/packages/theme-amethyst/src/sidebar.tsx b/packages/theme-amethyst/src/sidebar.tsx index 593554b..edec903 100644 --- a/packages/theme-amethyst/src/sidebar.tsx +++ b/packages/theme-amethyst/src/sidebar.tsx @@ -20,6 +20,7 @@ import { SidebarGroupContent, SidebarHeader, SidebarRail, + useSidebar, } from "@silicajs/ui/components/sidebar"; export type SidebarProps = { @@ -33,6 +34,8 @@ export function Sidebar({ config, assistant, }: SidebarProps) { + const { isMobile, setOpenMobile } = useSidebar(); + return ( @@ -48,7 +51,13 @@ export function Sidebar({
{assistant ? ( - + { + if (isMobile) setOpenMobile(false); + }} + /> ) : null}