@kit-ng-ui/popconfirm

Click-triggered confirm overlay with OK / Cancel buttons. Built on @kit-ng-ui/popover.

pnpm add @kit-ng-ui/popconfirm

// Loads popover styles automatically.
@use '@kit-ng-ui/popconfirm/styles' as popconfirm;

Usage

import { KitPopconfirmComponent } from '@kit-ng-ui/popconfirm';

<kit-popconfirm
  title="Delete this item?"
  description="This action cannot be undone."
  okText="Delete"
  okDanger
  (confirm)="remove(item)"
>
  <button>Delete</button>
</kit-popconfirm>

For an async confirm, set confirmLoading while the action runs — the popconfirm stays open and the OK button shows a spinner:

<kit-popconfirm
  [(open)]="confirmOpen"
  [confirmLoading]="saving()"
  title="Save changes?"
  (confirm)="save()"
>
  <button>Save</button>
</kit-popconfirm>

async save() {
  this.saving.set(true);
  try { await this.api.save(); this.confirmOpen.set(false); }
  finally { this.saving.set(false); }
}

API

| Input | Description | Type | Default | | ---------------- | ---------------------------------------------------------------------- | ----------------------- | ------------ | | arrow | Show the popover arrow. | boolean | true | | cancelText | Cancel button label. | string | 'Cancel' | | confirmLoading | Show a spinner on OK and disable Cancel. | boolean | false | | description | Optional secondary line below the title. | string \| null | null | | disabled | Disable the overlay. | boolean | false | | okDanger | Style the OK button as danger. | boolean | false | | okText | OK button label. | string | 'OK' | | okType | Button type. | KitButtonType | 'primary' | | open | Two-way bound open state. | boolean | false | | placement | Overlay placement (any KitPopoverPlacement). | KitPopoverPlacement | 'top' | | showIcon | Show the warning icon. | boolean | true | | title | Heading text. | string \| null | null |

| Output | Description | | --------- | ---------------------------------------------------- | | cancel | Cancel button clicked. | | confirm | OK button clicked. Closes unless confirmLoading. |

Notes

• Same v0.1 containing-block caveat as <kit-popover> (overflow / transform ancestors).
• Trigger is fixed to click. For hover-style confirms, use <kit-popover> directly.