Function: InterruptRenderer()¶

InterruptRenderer(props): ReactElement

Defined in: src/components/InterruptRenderer.tsx:279

Default human-in-the-loop interrupt UI: the approval card (Approve, Allow for this chat, Always allow, Deny with a reason — see ApprovalActions), the multiple-choice question card (single or multi-select, Other on every question, Submit and Skip, stepping through several questions), and a minimal card with Skip for an app's own request kind that has no registered renderer. Override per kind via interruptRenderers on KabooProvider; style it with the documented kaboo-interrupt-* and kaboo-approval-* classes.

Parameters¶

props¶

InterruptRendererProps\<CustomRequestReason | InterruptReason>

Returns¶

ReactElement

Example¶

import { InterruptRenderer } from "@pgege/kaboo-react";
import type { InterruptReason } from "@pgege/kaboo-react";

const reason: InterruptReason = {
  type: "form",
  questions: [{ question: "Which market?", options: ["AI", "Cloud"] }],
};

function Example() {
  return (
    <InterruptRenderer
      reason={reason}
      onResolve={() => {}}
      onCancel={() => {}}
    />
  );
}