Overlay

Dialog

Service-launched modal dialog. Inject `KjDialogService` and call `open()` with a template; mount `[kjDialog]` once near your trigger to host the panel. The wrapper component exists purely to give the dialog suite a dedicated documentation page.

Import

#import

Add the symbol to your component's imports array. The walkthrough below shows the most common usages — copy & tweak.

import { KjDialogComponent } from '@kouji-ui/components';

Loading editor

Playground

#playground

title

message

show cancel

open

<kj-button (click)="open()">Open dialog</kj-button>

// dialog body component
<kj-dialog>
  <h2>Save changes?</h2>
  <p>Your edits will be applied immediately.</p>
  <kj-button kjVariant="ghost">Cancel</kj-button>
  <kj-button kjVariant="default">Save</kj-button>
</kj-dialog>