// 1. Define the typed payload (CLT metadata)
@CustomLightningType('BookingPicker')
export class BookingPickerType {
  @field({ required: true })  caseId: string;
  @field({ type: 'list' })    slots: Array<{ start: string; engineerId: string }>;
}

// 2. Build the LWC renderer
import { LightningElement, api } from 'lwc';
export default class BookingPicker extends LightningElement {
  @api payload;   // typed as BookingPickerType
  @api respond;   // sends a new turn back to the agent

  pick(e) {
    this.respond({ chosenSlot: e.target.dataset.start });
  }
}

// 3. Bind it to your Agentforce Action's response type
//    → Agent renders it natively in the conversational panel.