- Implementation
- SmallAction API
Common Examples
Basic Usage
Quick action prompt:Copy
Ask AI
import { SmallAction } from "@servicetitan/ext-atlas";
function SmallActionExample() {
return (
<SmallAction
recommendationId="rec-123"
message="Would you like to apply this discount?"
description="10% off for returning customers"
onAccept={(id) => applyRecommendation(id)}
onReject={(id) => dismissRecommendation(id)}
/>
);
}
Without Description
Simple action prompt:Copy
Ask AI
import { SmallAction } from "@servicetitan/ext-atlas";
function SmallActionSimple() {
return (
<SmallAction
recommendationId="rec-456"
message="Accept this recommendation?"
onAccept={(id) => handleAccept(id)}
onReject={(id) => handleReject(id)}
/>
);
}
Disabled State
Prevent user interaction:Copy
Ask AI
import { SmallAction } from "@servicetitan/ext-atlas";
function SmallActionDisabled() {
return (
<SmallAction
recommendationId="rec-789"
message="Processing your request..."
onAccept={handleAccept}
onReject={handleReject}
buttonDisabled
/>
);
}
Copy
Ask AI
<SmallAction
recommendationId="rec-123"
message="Apply discount?"
description="10% off"
onAccept={handleAccept}
onReject={handleReject}
buttonDisabled={false}
/>
SmallAction Props
The main prompt message.
Callback fired when accept button is clicked.
Callback fired when reject button is clicked.
Unique identifier for this recommendation, passed to callbacks.
When true, disables both action buttons.
Additional CSS class name for custom styling.
Additional description text below the message.
