// In an app: import { setupPlanCard } from '@aparte/plugin-cards/plan';
const { setupPlanCard } = window.apartePlugins.cards.plan;
// A todo tool's input is the list itself: read the input, not the "ok" it returns.
setupPlanCard({ tool: 'write_todos', map: (_result, input) => input });
const titles = ['Read the merged pull requests', 'Group the changes by package', 'Write the notes', 'Check every link', 'Publish to the changelog'];
const todos = (done) => ({
todos: titles.map((content, i) => ({ content, status: i < done ? 'completed' : i === done ? 'in_progress' : 'pending' })),
});
// The agent sends the same call again with new statuses: the same card is redrawn, and no row moves.
const bubble = document.querySelector('aparte-chat-bubble');
const call = (done) => ({ id: 'c1', name: 'write_todos', input: todos(done) });
bubble.setSegments([{ id: 's1', type: 'tool_call', status: 'resolved', toolCall: call(0), result: 'ok' }]);
let done = 0;
const tick = setInterval(() => {
done += 1;
bubble.updateSegment('s1', { toolCall: call(done) });
if (done === titles.length) clearInterval(tick);
}, 1600);