;
+
+// ── Default ───────────────────────────────────────────────────────────────────
+
+export const ConfirmDialog: Story = DefaultStory;
+
+// ── Severities ────────────────────────────────────────────────────────────────
+
+export const SeveritiesStory: Story = Severities;
+
+// ── Sizes ─────────────────────────────────────────────────────────────────────
+
+export const Sizes: Story = SizesStory;
diff --git a/src/stories/components/confirm-dialog/examples/confirm-dialog-default.component.ts b/src/stories/components/confirm-dialog/examples/confirm-dialog-default.component.ts
new file mode 100644
index 00000000..44db24ee
--- /dev/null
+++ b/src/stories/components/confirm-dialog/examples/confirm-dialog-default.component.ts
@@ -0,0 +1,81 @@
+import { Component } from '@angular/core';
+import { ExtraButtonComponent } from '../../../../lib/components/button/button.component';
+import { ExtraConfirmDialogComponent } from '../../../../lib/components/confirm-dialog/confirm-dialog.component';
+import { ConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service';
+
+const template = `
+
+
+
+
+
+`;
+
+@Component({
+ selector: 'app-confirm-dialog-default',
+ standalone: true,
+ imports: [ExtraConfirmDialogComponent, ExtraButtonComponent],
+ template,
+})
+export class ConfirmDialogDefaultComponent {
+ constructor(private confirmDialogService: ConfirmDialogService) {}
+
+ showConfirm(): void {
+ this.confirmDialogService.confirm({
+ key: 'cd-default',
+ message: 'Вы уверены, что хотите продолжить?',
+ header: 'Подтверждение',
+ icon: 'ti ti-alert-triangle',
+ acceptLabel: 'Да',
+ rejectLabel: 'Нет',
+ accept: () => {},
+ reject: () => {},
+ });
+ }
+}
+
+export const Default = {
+ name: 'ConfirmDialog',
+ render: () => ({
+ template: ``,
+ }),
+ parameters: {
+ docs: {
+ description: { story: 'Базовый пример диалога подтверждения.' },
+ source: {
+ language: 'ts',
+ code: `
+import { Component } from '@angular/core';
+import { ExtraConfirmDialogComponent, ConfirmDialogService, ExtraButtonComponent, provideConfirmDialog } from '@cdek-it/angular-ui-kit';
+
+@Component({
+ selector: 'app-confirm-dialog-default',
+ standalone: true,
+ imports: [ExtraConfirmDialogComponent, ExtraButtonComponent],
+ providers: [provideConfirmDialog()],
+ template: \`
+
+
+ \`,
+})
+export class ConfirmDialogDefaultComponent {
+ constructor(private confirmDialogService: ConfirmDialogService) {}
+
+ showConfirm(): void {
+ this.confirmDialogService.confirm({
+ key: 'cd-default',
+ message: 'Вы уверены, что хотите продолжить?',
+ header: 'Подтверждение',
+ icon: 'ti ti-alert-triangle',
+ acceptLabel: 'Да',
+ rejectLabel: 'Нет',
+ accept: () => {},
+ reject: () => {},
+ });
+ }
+}
+ `,
+ },
+ },
+ },
+};
diff --git a/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts b/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts
new file mode 100644
index 00000000..00a0920a
--- /dev/null
+++ b/src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts
@@ -0,0 +1,189 @@
+import { Component } from '@angular/core';
+import { ExtraButtonComponent } from '../../../../lib/components/button/button.component';
+import { ExtraConfirmDialogComponent } from '../../../../lib/components/confirm-dialog/confirm-dialog.component';
+import { ConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service';
+
+interface SeverityItem {
+ type: 'success' | 'info' | 'warn' | 'help' | 'danger';
+ buttonSeverity: 'success' | 'info' | 'warn' | 'help' | 'danger';
+ icon: string;
+ label: string;
+ header: string;
+ message: string;
+ acceptLabel: string;
+}
+
+const SEVERITIES: SeverityItem[] = [
+ {
+ type: 'success',
+ buttonSeverity: 'success',
+ icon: 'ti ti-circle-check',
+ label: 'Успех',
+ header: 'Успех',
+ message: 'Операция выполнена успешно.',
+ acceptLabel: 'OK',
+ },
+ {
+ type: 'info',
+ buttonSeverity: 'info',
+ icon: 'ti ti-info-circle',
+ label: 'Информация',
+ header: 'Информация',
+ message: 'Это информационное сообщение.',
+ acceptLabel: 'Понятно',
+ },
+ {
+ type: 'warn',
+ buttonSeverity: 'warn',
+ icon: 'ti ti-alert-triangle',
+ label: 'Предупреждение',
+ header: 'Предупреждение',
+ message: 'Внимание! Это действие может иметь последствия.',
+ acceptLabel: 'Продолжить',
+ },
+ {
+ type: 'help',
+ buttonSeverity: 'help',
+ icon: 'ti ti-help-circle',
+ label: 'Справка',
+ header: 'Справка',
+ message: 'Нужна помощь с этим действием?',
+ acceptLabel: 'Да',
+ },
+ {
+ type: 'danger',
+ buttonSeverity: 'danger',
+ icon: 'ti ti-circle-x',
+ label: 'Удаление',
+ header: 'Подтверждение',
+ message: 'Это действие нельзя отменить. Продолжить?',
+ acceptLabel: 'Удалить',
+ },
+];
+
+const template = `
+
+
+
+
+
+
+
+
+ @for (severity of severities; track severity.type) {
+
+ }
+
+
+ @for (severity of severities; track severity.type) {
+
+ }
+
+ \`,
+})
+export class ConfirmDialogSeveritiesComponent {
+ severities = SEVERITIES;
+ constructor(private confirmDialogService: ConfirmDialogService) {}
+
+ showConfirm(severity: SeverityItem): void {
+ this.confirmDialogService.confirm({
+ key: 'cd-severity-' + severity.type,
+ message: severity.message,
+ header: severity.header,
+ icon: severity.icon,
+ acceptLabel: severity.acceptLabel,
+ rejectLabel: 'Нет',
+ acceptButtonProps: { severity: severity.buttonSeverity },
+ accept: () => {},
+ reject: () => {},
+ });
+ }
+}
+ `,
+ },
+ },
+ },
+};
diff --git a/src/stories/components/confirm-dialog/examples/confirm-dialog-sizes.component.ts b/src/stories/components/confirm-dialog/examples/confirm-dialog-sizes.component.ts
new file mode 100644
index 00000000..5fc3945d
--- /dev/null
+++ b/src/stories/components/confirm-dialog/examples/confirm-dialog-sizes.component.ts
@@ -0,0 +1,130 @@
+import { Component } from '@angular/core';
+import { ExtraButtonComponent } from '../../../../lib/components/button/button.component';
+import {
+ ExtraConfirmDialogComponent,
+ ExtraConfirmDialogSize,
+} from '../../../../lib/components/confirm-dialog/confirm-dialog.component';
+import { ConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service';
+
+interface SizeItem {
+ key: ExtraConfirmDialogSize;
+ label: string;
+}
+
+const SIZES: SizeItem[] = [
+ { key: 'sm', label: 'Small' },
+ { key: 'default', label: 'Base' },
+ { key: 'lg', label: 'Large' },
+ { key: 'xlg', label: 'Extra Large' },
+];
+
+const template = `
+
+
+
+
+
+
+
+ @for (size of sizes; track size.key) {
+
+ }
+
+
+ @for (size of sizes; track size.key) {
+
+ }
+
+ \`,
+})
+export class ConfirmDialogSizesComponent {
+ sizes = SIZES;
+ constructor(private confirmDialogService: ConfirmDialogService) {}
+
+ showConfirm(size: SizeItem): void {
+ this.confirmDialogService.confirm({
+ key: 'cd-size-' + size.key,
+ message: 'Это диалог размера ' + size.label,
+ header: 'Подтверждение',
+ icon: 'ti ti-alert-triangle',
+ acceptLabel: 'Да',
+ rejectLabel: 'Нет',
+ accept: () => {},
+ reject: () => {},
+ });
+ }
+}
+ `,
+ },
+ },
+ },
+};