Documentation

Slots and render-prop overrides

There is no slot API today. Customise via theme tokens and CSS overrides.

Not supported today

Earlier versions of this page documented seven render-prop slots (renderHeader, renderWelcome, renderRegistration, renderMessage, renderInput, renderEmptyState, renderEngageNotice). None of those exist in the chat-client source. There is no module-level slot API today — grep for any of those names in chat-client/src/ returns zero hits.

The widget is delivered as a script bundle loaded from https://web.appmint.space/chat-client/appmint-chat.js and initialised via window.AppmintChat.init(config). The configuration object accepts theme tokens, CSS classes, and a small set of identity props — it does not accept React render functions. The bundle's React tree is a closed surface today.

What you can do today

Customisation paths that work right now:

  • Theme tokens. Pass theme: 'light' or theme: 'dark' to init, or override the panel's CSS variables (--amc-primary, --amc-bubble-self, etc.) from your host stylesheet. See Theming.
  • className and style on the outer container. Useful for repositioning the bubble (bottom-32 right-12) and tweaking spacing.
  • Server-side chat-config content. The widget reads welcome.title, welcome.subtitle, headerContent, logo.url, and availability from the AppEngine chat-config record. Edit those and every visitor picks up the change on next load — no rebuild required.
  • i18n strings. Add a locale folder under src/locales/ (when self-hosting the bundle) or override individual keys at runtime. See i18n.

What you cannot do today

  • Replace the chat header, message bubble, registration form, composer, empty state, or engage toast with your own React components.
  • Pass render functions or React nodes to AppmintChat.init.
  • Hot-swap individual subtrees of the panel from the host page.

If you need any of these, the only option today is to fork chat-client and rebuild the bundle. The repo lives at /Users/imzee/projects/chat-client/ and the canonical entry is src/chat-app.tsx.

Building UI outside the panel

For a fully custom surface (a sidebar, a notification bell, your own dashboard), don't try to override pieces of the panel — replace it. The widget exposes its store on window once init runs, and you can subscribe to events from your own components. See Events and hooks for the patterns.