Drop-in SwiftUI chat view, headless ChatEngine, LLM-agnostic via AnyLanguageModel. Read-only by default with configurable allowlists. Robust SQL parser with 63 tests. Includes demo app with GitHub stars dataset.
4.1 KiB
4.1 KiB
Theming
SwiftDBAI's chat interface is customizable through ChatViewConfiguration. Pass it via the .chatViewConfiguration() view modifier -- it propagates through the entire view hierarchy via SwiftUI environment.
Built-in Presets
Default
The standard look. Blue user bubbles, system-colored assistant bubbles, standard fonts.
DataChatView(databasePath: path, model: myLLM)
// .chatViewConfiguration(.default) is implicit
Dark
Muted colors for dark backgrounds. Dark gray bubbles, light text, black background.
DataChatView(databasePath: path, model: myLLM)
.chatViewConfiguration(.dark)
Compact
Smaller fonts, tighter padding, no SQL disclosure. Good for embedded or secondary views.
DataChatView(databasePath: path, model: myLLM)
.chatViewConfiguration(.compact)
Custom Configuration
Start from any preset and override what you need:
var config = ChatViewConfiguration.default
config.userBubbleColor = .purple
config.userTextColor = .white
config.accentColor = .purple
config.inputPlaceholder = "Search GitHub repos..."
config.emptyStateTitle = "Explore GitHub Data"
config.emptyStateSubtitle = "Ask about stars, forks, languages, and trends"
config.emptyStateIcon = "star.circle"
DataChatView(databasePath: path, model: myLLM)
.chatViewConfiguration(config)
| Custom empty state | Custom with results |
|---|---|
![]() |
![]() |
Available Properties
Colors
| Property | Default | Description |
|---|---|---|
userBubbleColor |
.accentColor |
Background of user message bubbles |
userTextColor |
.white |
Text color in user bubbles |
assistantBubbleColor |
System secondary | Background of assistant bubbles |
assistantTextColor |
.primary |
Text color in assistant bubbles |
backgroundColor |
.clear |
Overall chat view background |
inputBarBackgroundColor |
.clear |
Input bar area background |
accentColor |
.accentColor |
Send button and interactive elements |
errorColor |
.red |
Error message icon and border |
Typography
| Property | Default | Description |
|---|---|---|
messageFont |
.body |
Chat message text |
summaryFont |
.body |
Natural language summary |
sqlFont |
.caption monospaced |
SQL query display |
inputFont |
.body |
Text input field |
Layout & Content
| Property | Default | Description |
|---|---|---|
messagePadding |
14 |
Padding inside message bubbles |
bubbleCornerRadius |
16 |
Corner radius of bubbles |
showTimestamps |
false |
Show timestamps on messages |
showSQLDisclosure |
true |
Show the "</> SQL Query" expandable section |
inputPlaceholder |
"Ask about your data..." |
Placeholder text in input field |
emptyStateTitle |
"Ask a question about your data" |
Title when no messages |
emptyStateSubtitle |
"Try something like..." |
Subtitle when no messages |
emptyStateIcon |
"bubble.left.and.text.bubble.right" |
SF Symbol for empty state |
Avatar
| Property | Default | Description |
|---|---|---|
assistantAvatarIcon |
nil |
SF Symbol for assistant avatar (e.g. "sparkles", "person.crop.circle.fill") |
assistantAvatarColor |
.accentColor |
Background color of the avatar circle |
When set, a circular avatar appears next to every assistant message:
config.assistantAvatarIcon = "sparkles"
config.assistantAvatarColor = .purple
Works with All Presentation Modes
The configuration propagates through sheets, navigation, and UIKit bridges:
// Sheet
.sheet(isPresented: $show) {
DataChatSheet(databasePath: path, model: myLLM)
.chatViewConfiguration(.dark)
}
// UIKit
let vc = DataChatViewController(databasePath: path, model: myLLM)
// Configuration can be set on the rootView before presenting





