Skip to content

ChatButton

A persistent chat trigger styled as navbar chrome for AppShell actions.

Source

import { ChatButton } from "@flanksource/clicky-ui/ai";

No dedicated Storybook demo is available for this component yet.

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Prop Type Default Description
className string — —
contextItems ChatContextItem[] — Context the page offers the chat: attached to a newly opened window, or merged (by id) into the window a persistent launcher focuses.
icon string | ComponentClass<any, any> | FunctionComponent<any> Object.assign( ({ size = "1em", className, title, ...props }: IconProps) => ( <svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} viewBox="0 0 256 256" role={title ? "img" : "presentation"} aria-label={title} aria-hidden={title ? undefined : true} className={className} {...props}> <path fill="currentColor" d="M196.89 130.94L144.4 111.6l-19.34-52.49a13.92 13.92 0 0 0-26.12 0L79.6 111.6l-52.49 19.34a13.92 13.92 0 0 0 0 26.12L79.6 176.4l19.34 52.49a13.92 13.92 0 0 0 26.12 0l19.34-52.49l52.49-19.34a13.92 13.92 0 0 0 0-26.12m-4.15 14.86l-55.08 20.3a6 6 0 0 0-3.56 3.56l-20.3 55.08a1.92 1.92 0 0 1-3.6 0l-20.3-55.08a6 6 0 0 0-3.56-3.56l-55.08-20.3a1.92 1.92 0 0 1 0-3.6l55.08-20.3a6 6 0 0 0 3.56-3.56l20.3-55.08a1.92 1.92 0 0 1 3.6 0l20.3 55.08a6 6 0 0 0 3.56 3.56l55.08 20.3a1.92 1.92 0 0 1 0 3.6M146 40a6 6 0 0 1 6-6h18V16a6 6 0 0 1 12 0v18h18a6 6 0 0 1 0 12h-18v18a6 6 0 0 1-12 0V46h-18a6 6 0 0 1-6-6m100 48a6 6 0 0 1-6 6h-10v10a6 6 0 0 1-12 0V94h-10a6 6 0 0 1 0-12h10V72a6 6 0 0 1 12 0v10h10a6 6 0 0 1 6 6"/> </svg> ), { __source: "ph:sparkle-light", __viewBox: "0 0 256 256", __group: "ai-ml", __consumerName: "sparkles", displayName: "UiSparkles" }, ) Iconify name or imported icon component shown in the button.
label string Open chat Accessible label / tooltip.