Agents
AskMaxAction
A contextual "Ask Max" button.
Guidelines#
It hands the record on screen to Max's floating chat as visible, editable context, and never sends or changes anything by itself.
Use it for the header of a person, organization, campaign, meeting, signal or dashboard view, when the obvious next question is one for Max.
What you provide
request: anAskMaxRequestInput.source: dashboard, analytics, sales_system, signals, signal_proposal, signal_monitor, gtm_canvas, campaign, meeting, person or organization.label: up to 120 characters, shown above the composer.objective: up to 700 characters.- Optional
entityIdand a smallcontextof at most 12 keys, with values trimmed to 280 characters.
label(default "Ask Max") andshowLabel(default true).- Any
Buttonprop.variantdefaults to"outline"andsizeto"sm".
Anatomy: a Button with a size-4 Sparkles icon; the labelled form uses gap-1.5. Icon-only keeps an aria-label of "{label}: {request.label}", and every button carries that text as its title. In the app it appears as outline "Ask Max", ghost "Review with Max" and rounded-full "Run full review".
Behaviour: a click dispatches a max-agent:ask-context window event with the request and a generated prompt. The prompt tells Max to treat the context as data, verify it live, and ask before creating, sending or deleting anything.
Don't put secrets or large payloads in context, or use it as a "run now" button. Execution goes through Max's confirmation in chat.
Facts#
| Group | Agents |
|---|---|
| Product | Max |
| Global | window.DigitalCrew.AskMaxAction |
| Source | max-agent: src/features/agent/ui/ask-max-action.tsx |
| Import in the app | import { AskMaxAction } from "@/features/agent/ui/ask-max-action"; |
API#
TypeScript declarations emitted from src/features/agent/ui/ask-max-action.tsx.
interface AskMaxActionProps extends Omit<ComponentProps<typeof Button>, "children" | "onClick"> {
request: AskMaxRequestInput;
label?: string;
showLabel?: boolean;
}
export declare function AskMaxAction({ request, label, showLabel, variant, size, className, ...buttonProps }: AskMaxActionProps): JSX.Element;Example#
The code of the preview above: plain React.createElement against window.DigitalCrew, with realistic data.
<div id="root" class="p-6"></div>
<script>
(function () {
var h = React.createElement, DC = window.DigitalCrew, I = DC.Icons;
var PERSON = {
source: "person", label: "Claire Dubois, CFO at Northwind Traders", entityId: "3f2b9c1e-6d4a-4b8e-9a51-2c7d0e4f8a10",
objective: "Prepare me for Thursday's first call: what Northwind is reviewing in Q1, who else is likely in the buying group, and the one question that would qualify the deal fastest.",
context: { title: "CFO", company: "Northwind Traders", stage: "Meeting booked", last_touch: "Replied on LinkedIn today" }
};
var CAMPAIGN = {
source: "campaign", label: "Q4 CFO outreach", entityId: "c0ffee00-0000-4000-8000-000000000001",
objective: "Review this campaign's reply rate by step and recommend one change to the sequence, with the reason.",
context: { status: "active", prospects: 212, reply_rate: "8.4%" }
};
var SIGNALS = {
source: "signals", label: "Signals overview",
objective: "Triage my current signal monitors and pending proposals. Explain which opportunities deserve attention first, what evidence is missing, and the safest next GTM action.",
context: { pending_proposals: 3, monitors: 5, active_monitors: 4 }
};
function App() {
var r = React.useState(null), last = r[0], setLast = r[1];
React.useEffect(function () {
function onAsk(e) { setLast(e.detail); }
window.addEventListener("max-agent:ask-context", onAsk);
return function () { window.removeEventListener("max-agent:ask-context", onAsk); };
}, []);
return h("div", { className: "mx-auto flex max-w-[640px] flex-col gap-4" },
h("div", { className: "flex items-center justify-between gap-3 rounded-xl border border-border/60 bg-card px-4 py-3" },
h("div", { className: "min-w-0" },
h("div", { className: "truncate text-sm font-semibold" }, "Claire Dubois"),
h("div", { className: "truncate text-xs text-muted-foreground" }, "CFO at Northwind Traders · Meeting booked")),
h("div", { className: "flex shrink-0 items-center gap-2" },
h(DC.AskMaxAction, { request: PERSON }),
h(DC.AskMaxAction, { request: CAMPAIGN, showLabel: false, variant: "ghost", size: "icon-sm" }))),
h("div", { className: "flex items-center gap-2" },
h(DC.AskMaxAction, { request: SIGNALS, label: "Review with Max", variant: "ghost" }),
h(DC.AskMaxAction, { request: SIGNALS, label: "Run full review", variant: "default", className: "rounded-full" })),
h("div", { className: "rounded-xl border border-dashed border-border bg-muted/30 px-4 py-3 text-xs" },
h("div", { className: "mb-1 font-medium text-muted-foreground" }, "What reaches Max's composer"),
last
? h("div", { className: "space-y-1" },
h("div", { className: "font-medium text-foreground" }, last.label),
h("div", { className: "line-clamp-2 text-muted-foreground" }, last.objective))
: h("div", { className: "text-muted-foreground" }, "Click a button: the request is dispatched as an event with the record as context. Nothing is sent until you confirm in chat.")));
}
ReactDOM.createRoot(document.getElementById("root")).render(h(DC.TooltipProvider, { delayDuration: 80 }, h(App)));
})();
</script>