@pleione-lab/widgets 1.0.2 → 1.0.3

package/fesm2022/pleione-lab-widgets.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { output, effect, ChangeDetectionStrategy, Component, input, inject, DestroyRef, signal, computed, TemplateRef, ElementRef, ViewChild, Injector, PLATFORM_ID } from '@angular/core';
+import { output, effect, ChangeDetectionStrategy, Component, input, inject, DestroyRef, signal, computed, TemplateRef, ElementRef, ViewChild, PLATFORM_ID, Injector } from '@angular/core';
 import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1 from '@angular/forms';
 import { FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i3 from '@taiga-ui/core';
-import { TuiTextfieldComponent, TuiIcon, TuiInput, TuiLabel, TuiButton, TuiError, TuiLoader, TuiFilterByInputPipe, TuiHint, tuiValidationErrorsProvider, TuiDialogService, TuiCalendar, TuiNotification } from '@taiga-ui/core';
+import { TuiTextfieldComponent, TuiIcon, TuiInput, TuiLabel, TuiButton, TuiError, TuiLoader, TuiFilterByInputPipe, TuiHint, tuiValidationErrorsProvider, TuiCalendar, TuiNotification, TuiDialogService } from '@taiga-ui/core';
 import * as i2 from '@taiga-ui/core/components/label';
 import * as i2$1 from '@taiga-ui/kit';
 import { TuiChevron, TuiTooltip, TuiDataListWrapper, TuiSelect, TuiDataListWrapperComponent, TuiComboBox, TuiInputNumber, TuiTextarea, TuiCopy, TuiInputPhone, TuiPassword, TuiInputDateTime, TuiInputDateRange, TuiCalendarRange } from '@taiga-ui/kit';
@@ -12,13 +12,12 @@ import * as i3$1 from '@taiga-ui/core/components/textfield';
 import * as i4 from '@taiga-ui/core/portals/dropdown';
 import { Subject, filter, debounceTime, tap, switchMap, catchError, of } from 'rxjs';
 import { WA_IS_IOS } from '@ng-web-apis/platform';
-import { KeitControl as KeitControl$1, SimpleInputWidget as SimpleInputWidget$1, SimpleTextareaWidget as SimpleTextareaWidget$1, SimpleActionsWidget as SimpleActionsWidget$1, SimpleFlexLayout as SimpleFlexLayout$1, validatorsProvider as validatorsProvider$1, SimpleButtonWidget as SimpleButtonWidget$1 } from '@keit/widgets';
-import { injectContext, PolymorpheusComponent } from '@taiga-ui/polymorpheus';
 import * as i6 from '@taiga-ui/core/components/calendar';
 import * as i6$1 from '@taiga-ui/kit/components/calendar-range';
 import { TuiTablePagination, tuiTablePaginationOptionsProvider } from '@taiga-ui/addon-table';
 import { isPlatformBrowser } from '@angular/common';
 import { TuiMonth, TuiDay } from '@taiga-ui/cdk';
+import { injectContext, PolymorpheusComponent } from '@taiga-ui/polymorpheus';
 
 class LoginInputWidget {
     loginCtrl = new FormControl('', [
@@ -1329,153 +1328,332 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
     `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}.base{display:grid;gap:20px;grid-auto-rows:auto}@media(max-width:480px){.base{grid-template-columns:1fr!important}}\n"] }]
         }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }] } });
 
-let NameDescriptionComponent$1 = class NameDescriptionComponent {
-    context = injectContext();
-    name = KeitControl$1.create('')
-        .required()
-        .minLength(3)
-        .maxLength(255);
-    description = KeitControl$1.create('')
-        .required()
-        .minLength(3)
-        .maxLength(1024);
-    cancel() {
-        this.name.reset();
-        this.description.reset();
-    }
-    accept() {
-        this.context.completeWith({
-            name: this.name.value,
-            description: this.description.value,
-        });
-        this.name.reset();
-        this.description.reset();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: NameDescriptionComponent, isStandalone: true, selector: "keit-name-description-component", providers: [validatorsProvider$1], ngImport: i0, template: `
-        <keit-simple-flex [gap]="8" direction="vertical">
-            <keit-simple-input-widget
-                [control]="name"
-                placeholder="Название"
-                sample="Компот"
+class SimpleDateInputWidget {
+    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    sample = input('Введите...', ...(ngDevMode ? [{ debugName: "sample" }] : /* istanbul ignore next */ []));
+    control = input.required(...(ngDevMode ? [{ debugName: "control" }] : /* istanbul ignore next */ []));
+    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
+    iconRight = input('', ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
+    cleaner = input(...(ngDevMode ? [undefined, { debugName: "cleaner" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateInputWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: SimpleDateInputWidget, isStandalone: true, selector: "keit-simple-date-input-widget", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, cleaner: { classPropertyName: "cleaner", publicName: "cleaner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+        <tui-textfield
+            [tuiTextfieldSize]="size()"
+            [tuiTextfieldCleaner]="cleaner() ?? false"
+        >
+            <label tuiLabel>{{ placeholder() }}</label>
+            <input
+                tuiInputDateTime
+                [placeholder]="sample()"
+                [formControl]="control()"
+                [readOnly]="readonly()"
             />
+            <tui-calendar *tuiDropdown />
 
-            <keit-simple-textarea
-                placeholder="Описание"
-                [limit]="1024"
-                [control]="description"
-                [size]="'m'"
-                sample="Введите тут описание"
-            />
+            @if (iconRight()) {
+                <tui-icon [icon]="iconRight()" />
+            }
 
-            <keit-simple-actions
-                [size]="'s'"
-                (cancelEvent)="cancel(); context.completeWith(null)"
-                (acceptEvent)="accept()"
-                [disabled]="name.invalid || description.invalid"
-            />
-        </keit-simple-flex>
-    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleInputWidget$1, selector: "keit-simple-input-widget", inputs: ["placeholder", "sample", "control", "size", "readonly", "hint", "iconRight", "cleaner", "hasEnter", "focused"], outputs: ["enter"] }, { kind: "component", type: SimpleTextareaWidget$1, selector: "keit-simple-textarea", inputs: ["placeholder", "sample", "control", "limit", "size", "cleaner"] }, { kind: "component", type: SimpleActionsWidget$1, selector: "keit-simple-actions", inputs: ["primaryIcon", "secondaryIcon", "disabled", "primaryCaption", "secondaryCaption", "hasSecondary", "size"], outputs: ["acceptEvent", "cancelEvent"] }, { kind: "component", type: SimpleFlexLayout$1, selector: "keit-simple-flex", inputs: ["gap", "direction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-};
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent$1, decorators: [{
+            @if (hint()) {
+                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
+            }
+        </tui-textfield>
+    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: i3$1.TuiTextfieldComponent, selector: "tui-textfield:not([multi])", inputs: ["content", "filler"] }, { kind: "directive", type: i3$1.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiDropdownContent, selector: "ng-template[tuiDropdown]" }, { kind: "directive", type: i2$1.TuiInputDateTimeDirective, selector: "input[tuiInputDateTime]", inputs: ["timeMode", "min", "max"] }, { kind: "component", type: i6.TuiCalendar, selector: "tui-calendar", inputs: ["disabledItemHandler", "min", "max", "minViewedMonth", "maxViewedMonth", "showAdjacent", "markerHandler", "initialView", "month", "hoveredItem", "value"], outputs: ["monthChange", "hoveredItemChange", "valueChange", "dayClick"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "directive", type: TuiTooltip, selector: "tui-icon[tuiTooltip]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateInputWidget, decorators: [{
             type: Component,
-            args: [{ selector: 'keit-name-description-component', imports: [
-                        FormsModule,
+            args: [{ selector: 'keit-simple-date-input-widget', imports: [
                         ReactiveFormsModule,
+                        FormsModule,
                         TuiInput,
-                        SimpleInputWidget$1,
-                        SimpleTextareaWidget$1,
-                        SimpleActionsWidget$1,
-                        SimpleFlexLayout$1,
+                        TuiInputDateTime,
+                        TuiLabel,
+                        TuiIcon,
+                        TuiTooltip,
+                        TuiCalendar,
+                        TuiHint,
                     ], template: `
-        <keit-simple-flex [gap]="8" direction="vertical">
-            <keit-simple-input-widget
-                [control]="name"
-                placeholder="Название"
-                sample="Компот"
+        <tui-textfield
+            [tuiTextfieldSize]="size()"
+            [tuiTextfieldCleaner]="cleaner() ?? false"
+        >
+            <label tuiLabel>{{ placeholder() }}</label>
+            <input
+                tuiInputDateTime
+                [placeholder]="sample()"
+                [formControl]="control()"
+                [readOnly]="readonly()"
             />
+            <tui-calendar *tuiDropdown />
 
-            <keit-simple-textarea
-                placeholder="Описание"
-                [limit]="1024"
-                [control]="description"
-                [size]="'m'"
-                sample="Введите тут описание"
+            @if (iconRight()) {
+                <tui-icon [icon]="iconRight()" />
+            }
+
+            @if (hint()) {
+                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
+            }
+        </tui-textfield>
+    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
+        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], sample: [{ type: i0.Input, args: [{ isSignal: true, alias: "sample", required: false }] }], control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], cleaner: [{ type: i0.Input, args: [{ isSignal: true, alias: "cleaner", required: false }] }] } });
+
+class SimpleDateRangeInputWidget {
+    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    sample = input('Введите...', ...(ngDevMode ? [{ debugName: "sample" }] : /* istanbul ignore next */ []));
+    control = input.required(...(ngDevMode ? [{ debugName: "control" }] : /* istanbul ignore next */ []));
+    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
+    iconRight = input('', ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
+    cleaner = input(...(ngDevMode ? [undefined, { debugName: "cleaner" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateRangeInputWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: SimpleDateRangeInputWidget, isStandalone: true, selector: "keit-simple-date-range-input-widget", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, cleaner: { classPropertyName: "cleaner", publicName: "cleaner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+        <tui-textfield
+            [tuiTextfieldSize]="size()"
+            [tuiTextfieldCleaner]="cleaner() ?? false"
+        >
+            <label tuiLabel>{{ placeholder() }}</label>
+            <input
+                tuiInputDateRange
+                [placeholder]="sample()"
+                [formControl]="control()"
+                [readOnly]="readonly()"
             />
+            <tui-calendar-range *tuiDropdown />
 
-            <keit-simple-actions
-                [size]="'s'"
-                (cancelEvent)="cancel(); context.completeWith(null)"
-                (acceptEvent)="accept()"
-                [disabled]="name.invalid || description.invalid"
+            @if (iconRight()) {
+                <tui-icon [icon]="iconRight()" />
+            }
+
+            @if (hint()) {
+                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
+            }
+        </tui-textfield>
+    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: i3$1.TuiTextfieldComponent, selector: "tui-textfield:not([multi])", inputs: ["content", "filler"] }, { kind: "directive", type: i3$1.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiDropdownContent, selector: "ng-template[tuiDropdown]" }, { kind: "directive", type: i2$1.TuiInputDateRangeDirective, selector: "input[tuiInputDateRange]", inputs: ["max", "min", "minLength", "maxLength"] }, { kind: "component", type: i6$1.TuiCalendarRange, selector: "tui-calendar-range", inputs: ["min", "max", "minLength", "maxLength", "items", "listSize", "defaultViewedMonth", "markerHandler", "disabledItemHandler", "value", "item"], outputs: ["valueChange", "itemChange"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "directive", type: TuiTooltip, selector: "tui-icon[tuiTooltip]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateRangeInputWidget, decorators: [{
+            type: Component,
+            args: [{ selector: 'keit-simple-date-range-input-widget', imports: [
+                        ReactiveFormsModule,
+                        FormsModule,
+                        TuiInput,
+                        TuiInputDateRange,
+                        TuiLabel,
+                        TuiIcon,
+                        TuiTooltip,
+                        TuiCalendarRange,
+                        TuiHint,
+                    ], template: `
+        <tui-textfield
+            [tuiTextfieldSize]="size()"
+            [tuiTextfieldCleaner]="cleaner() ?? false"
+        >
+            <label tuiLabel>{{ placeholder() }}</label>
+            <input
+                tuiInputDateRange
+                [placeholder]="sample()"
+                [formControl]="control()"
+                [readOnly]="readonly()"
             />
-        </keit-simple-flex>
-    `, providers: [validatorsProvider$1], changeDetection: ChangeDetectionStrategy.OnPush }]
-        }] });
+            <tui-calendar-range *tuiDropdown />
 
-class NameDescriptionDialog {
-    dialogs = inject(TuiDialogService);
-    injector = inject(Injector);
-    operation = input('create', ...(ngDevMode ? [{ debugName: "operation" }] : /* istanbul ignore next */ []));
-    disabled = input(...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
-    caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : /* istanbul ignore next */ []));
-    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    appearance = input('primary', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
-    result = output();
-    openDialog() {
-        this.dialogs
-            .open(new PolymorpheusComponent(NameDescriptionComponent$1, this.injector), {
-            label: `${this.operation() === 'create' ? 'Добавить' : 'Редактировать'}`,
-            size: 's',
-            dismissible: false,
-        })
-            .subscribe((data) => {
-            this.result.emit(data != null
-                ? {
-                    name: data.name,
-                    description: data.description,
-                }
-                : null);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: NameDescriptionDialog, isStandalone: true, selector: "keit-name-description-input-dialog", inputs: { operation: { classPropertyName: "operation", publicName: "operation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { result: "result" }, ngImport: i0, template: `
-        <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-        <keit-simple-button
-            [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
+            @if (iconRight()) {
+                <tui-icon [icon]="iconRight()" />
+            }
+
+            @if (hint()) {
+                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
+            }
+        </tui-textfield>
+    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
+        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], sample: [{ type: i0.Input, args: [{ isSignal: true, alias: "sample", required: false }] }], control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], cleaner: [{ type: i0.Input, args: [{ isSignal: true, alias: "cleaner", required: false }] }] } });
+
+class SimplePaginationWidget {
+    page = input.required(...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
+    size = input.required(...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    total = input.required(...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
+    paginationChange = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimplePaginationWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SimplePaginationWidget, isStandalone: true, selector: "keit-simple-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { paginationChange: "paginationChange" }, providers: [tuiTablePaginationOptionsProvider({ showPages: false })], ngImport: i0, template: `
+        <tui-table-pagination
+            [page]="page()"
             [size]="size()"
-            [caption]="caption()"
-            [appearance]="appearance()"
-            [disabled]="disabled()"
-            (action)="openDialog()"
+            [total]="total()"
+            (paginationChange)="paginationChange.emit($event)"
         />
-    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleButtonWidget$1, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, styles: [":host{display:block;padding:16px}\n"], dependencies: [{ kind: "component", type: TuiTablePagination, selector: "tui-table-pagination", inputs: ["items", "total", "page", "size"], outputs: ["pageChange", "sizeChange", "paginationChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimplePaginationWidget, decorators: [{
             type: Component,
-            args: [{ selector: 'keit-name-description-input-dialog', imports: [FormsModule, ReactiveFormsModule, TuiInput, SimpleButtonWidget$1], template: `
-        <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-        <keit-simple-button
-            [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
+            args: [{ selector: 'keit-simple-pagination', imports: [TuiTablePagination], template: `
+        <tui-table-pagination
+            [page]="page()"
             [size]="size()"
-            [caption]="caption()"
-            [appearance]="appearance()"
-            [disabled]="disabled()"
-            (action)="openDialog()"
+            [total]="total()"
+            (paginationChange)="paginationChange.emit($event)"
         />
-    `, changeDetection: ChangeDetectionStrategy.OnPush }]
-        }], propDecorators: { operation: [{ type: i0.Input, args: [{ isSignal: true, alias: "operation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], result: [{ type: i0.Output, args: ["result"] }] } });
-
-class NameDescriptionComponent {
+    `, providers: [tuiTablePaginationOptionsProvider({ showPages: false })], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;padding:16px}\n"] }]
+        }], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: true }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], paginationChange: [{ type: i0.Output, args: ["paginationChange"] }] } });
+
+class NotificationWidget {
+    platformId = inject(PLATFORM_ID);
+    size = input('l', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    appearance = input('info', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    closable = input(true, ...(ngDevMode ? [{ debugName: "closable" }] : /* istanbul ignore next */ []));
+    closeLabel = input('Close', ...(ngDevMode ? [{ debugName: "closeLabel" }] : /* istanbul ignore next */ []));
+    closeEvent = output();
+    hideable = input(false, ...(ngDevMode ? [{ debugName: "hideable" }] : /* istanbul ignore next */ []));
+    hideButtonLabel = input('Больше не показывать', ...(ngDevMode ? [{ debugName: "hideButtonLabel" }] : /* istanbul ignore next */ []));
+    hideButtonAppearance = input('flat', ...(ngDevMode ? [{ debugName: "hideButtonAppearance" }] : /* istanbul ignore next */ []));
+    hideButtonSize = input('s', ...(ngDevMode ? [{ debugName: "hideButtonSize" }] : /* istanbul ignore next */ []));
+    storageKey = input(...(ngDevMode ? [undefined, { debugName: "storageKey" }] : /* istanbul ignore next */ []));
+    shouldShow = signal(true, ...(ngDevMode ? [{ debugName: "shouldShow" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            const key = this.storageKey();
+            if (key && isPlatformBrowser(this.platformId)) {
+                const hidden = localStorage.getItem(`notification-hide-${key}`);
+                this.shouldShow.set(!hidden);
+            }
+        });
+    }
+    hideForever() {
+        const key = this.storageKey();
+        if (key && isPlatformBrowser(this.platformId)) {
+            localStorage.setItem(`notification-hide-${key}`, 'true');
+            this.shouldShow.set(false);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NotificationWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NotificationWidget, isStandalone: true, selector: "keit-notification-widget", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, hideable: { classPropertyName: "hideable", publicName: "hideable", isSignal: true, isRequired: false, transformFunction: null }, hideButtonLabel: { classPropertyName: "hideButtonLabel", publicName: "hideButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, hideButtonAppearance: { classPropertyName: "hideButtonAppearance", publicName: "hideButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, hideButtonSize: { classPropertyName: "hideButtonSize", publicName: "hideButtonSize", isSignal: true, isRequired: false, transformFunction: null }, storageKey: { classPropertyName: "storageKey", publicName: "storageKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: `
+        @if (shouldShow()) {
+            <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+            <div tuiNotification [size]="size()" [appearance]="appearance()">
+                <p class="text"><ng-content></ng-content></p>
+                @if (hideable()) {
+                    <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+                    <keit-simple-button
+                        [appearance]="hideButtonAppearance()"
+                        [size]="hideButtonSize()"
+                        [caption]="hideButtonLabel()"
+                        (action)="hideForever()"
+                    />
+                }
+                @if (closable()) {
+                    <button
+                        iconStart="@tui.x"
+                        tuiIconButton
+                        type="button"
+                        (click)="shouldShow.set(false)"
+                    >
+                        {{ closeLabel() }}
+                    </button>
+                }
+            </div>
+        }
+    `, isInline: true, styles: [":host{display:block;margin-bottom:8px}.text{font-size:12px;padding:8px 8px 0}\n"], dependencies: [{ kind: "directive", type: i3.TuiNotificationDirective, selector: "[tuiNotification]:not(ng-template)", inputs: ["appearance", "size", "icon"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: SimpleButtonWidget, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NotificationWidget, decorators: [{
+            type: Component,
+            args: [{ selector: 'keit-notification-widget', imports: [TuiNotification, TuiButton, SimpleButtonWidget], template: `
+        @if (shouldShow()) {
+            <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+            <div tuiNotification [size]="size()" [appearance]="appearance()">
+                <p class="text"><ng-content></ng-content></p>
+                @if (hideable()) {
+                    <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+                    <keit-simple-button
+                        [appearance]="hideButtonAppearance()"
+                        [size]="hideButtonSize()"
+                        [caption]="hideButtonLabel()"
+                        (action)="hideForever()"
+                    />
+                }
+                @if (closable()) {
+                    <button
+                        iconStart="@tui.x"
+                        tuiIconButton
+                        type="button"
+                        (click)="shouldShow.set(false)"
+                    >
+                        {{ closeLabel() }}
+                    </button>
+                }
+            </div>
+        }
+    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;margin-bottom:8px}.text{font-size:12px;padding:8px 8px 0}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], closeEvent: [{ type: i0.Output, args: ["closeEvent"] }], hideable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideable", required: false }] }], hideButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonLabel", required: false }] }], hideButtonAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonAppearance", required: false }] }], hideButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonSize", required: false }] }], storageKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "storageKey", required: false }] }] } });
+
+class SimpleCalendarWidget {
+    markerConditionFn = input(null, ...(ngDevMode ? [{ debugName: "markerConditionFn" }] : /* istanbul ignore next */ []));
+    initialMonth = input(null, ...(ngDevMode ? [{ debugName: "initialMonth" }] : /* istanbul ignore next */ []));
+    initialDay = input(null, ...(ngDevMode ? [{ debugName: "initialDay" }] : /* istanbul ignore next */ []));
+    selectDay = output();
+    selectMonth = output();
+    value = null;
+    selectedMonth = TuiMonth.currentLocal();
+    hoveredItem = null;
+    ngOnInit() {
+        const initialMonth = this.initialMonth();
+        if (initialMonth) {
+            this.selectedMonth = initialMonth;
+            this.value = new TuiDay(this.selectedMonth.year, this.selectedMonth.month, 1);
+        }
+        const initialDay = this.initialDay();
+        if (initialDay) {
+            this.value = initialDay;
+        }
+    }
+    onDayClick(day) {
+        this.value = day;
+        this.selectDay.emit(day);
+    }
+    onMonthChange(month) {
+        this.selectedMonth = month;
+        this.selectMonth.emit(month);
+        this.value = new TuiDay(month.year, month.month, 1);
+        this.selectDay.emit(this.value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleCalendarWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SimpleCalendarWidget, isStandalone: true, selector: "keit-simple-calendar-widget", inputs: { markerConditionFn: { classPropertyName: "markerConditionFn", publicName: "markerConditionFn", isSignal: true, isRequired: false, transformFunction: null }, initialMonth: { classPropertyName: "initialMonth", publicName: "initialMonth", isSignal: true, isRequired: false, transformFunction: null }, initialDay: { classPropertyName: "initialDay", publicName: "initialDay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectDay: "selectDay", selectMonth: "selectMonth" }, ngImport: i0, template: `
+        <tui-calendar
+            [markerHandler]="this.markerConditionFn()"
+            [month]="selectedMonth"
+            [showAdjacent]="false"
+            [value]="value"
+            [(hoveredItem)]="hoveredItem"
+            (dayClick)="onDayClick($event)"
+            (monthChange)="onMonthChange($event)"
+        />
+    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: TuiCalendar, selector: "tui-calendar", inputs: ["disabledItemHandler", "min", "max", "minViewedMonth", "maxViewedMonth", "showAdjacent", "markerHandler", "initialView", "month", "hoveredItem", "value"], outputs: ["monthChange", "hoveredItemChange", "valueChange", "dayClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleCalendarWidget, decorators: [{
+            type: Component,
+            args: [{ selector: 'keit-simple-calendar-widget', imports: [ReactiveFormsModule, FormsModule, TuiCalendar], template: `
+        <tui-calendar
+            [markerHandler]="this.markerConditionFn()"
+            [month]="selectedMonth"
+            [showAdjacent]="false"
+            [value]="value"
+            [(hoveredItem)]="hoveredItem"
+            (dayClick)="onDayClick($event)"
+            (monthChange)="onMonthChange($event)"
+        />
+    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
+        }], propDecorators: { markerConditionFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "markerConditionFn", required: false }] }], initialMonth: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialMonth", required: false }] }], initialDay: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialDay", required: false }] }], selectDay: [{ type: i0.Output, args: ["selectDay"] }], selectMonth: [{ type: i0.Output, args: ["selectMonth"] }] } });
+
+let NameDescriptionComponent$1 = class NameDescriptionComponent {
     context = injectContext();
-    name = KeitControl$1.create('')
+    name = KeitControl.create('')
         .required()
-        .maxLength(30)
-        .minLength(2);
-    description = KeitControl$1.create('')
+        .minLength(3)
+        .maxLength(255);
+    description = KeitControl.create('')
         .required()
-        .maxLength(300)
-        .minLength(2);
+        .minLength(3)
+        .maxLength(1024);
     cancel() {
         this.name.reset();
         this.description.reset();
@@ -1489,21 +1667,20 @@ class NameDescriptionComponent {
         this.description.reset();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: NameDescriptionComponent, isStandalone: true, selector: "keit-name-component", providers: [
-            tuiValidationErrorsProvider({
-                required: 'Требуется ввести',
-                maxlength: ({ requiredLength }) => `Максимальная длина — ${requiredLength}`,
-                minlength: ({ requiredLength }) => of(`Минимальная длина — ${requiredLength}`),
-            }),
-        ], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: NameDescriptionComponent, isStandalone: true, selector: "keit-name-description-component", providers: [validatorsProvider], ngImport: i0, template: `
         <keit-simple-flex [gap]="8" direction="vertical">
-            <keit-simple-input-widget [control]="name" placeholder="Название" />
+            <keit-simple-input-widget
+                [control]="name"
+                placeholder="Название"
+                sample="Компот"
+            />
 
             <keit-simple-textarea
                 placeholder="Описание"
-                [limit]="1200"
+                [limit]="1024"
                 [control]="description"
                 [size]="'m'"
+                sample="Введите тут описание"
             />
 
             <keit-simple-actions
@@ -1513,27 +1690,32 @@ class NameDescriptionComponent {
                 [disabled]="name.invalid || description.invalid"
             />
         </keit-simple-flex>
-    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleInputWidget$1, selector: "keit-simple-input-widget", inputs: ["placeholder", "sample", "control", "size", "readonly", "hint", "iconRight", "cleaner", "hasEnter", "focused"], outputs: ["enter"] }, { kind: "component", type: SimpleTextareaWidget$1, selector: "keit-simple-textarea", inputs: ["placeholder", "sample", "control", "limit", "size", "cleaner"] }, { kind: "component", type: SimpleActionsWidget$1, selector: "keit-simple-actions", inputs: ["primaryIcon", "secondaryIcon", "disabled", "primaryCaption", "secondaryCaption", "hasSecondary", "size"], outputs: ["acceptEvent", "cancelEvent"] }, { kind: "component", type: SimpleFlexLayout$1, selector: "keit-simple-flex", inputs: ["gap", "direction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent, decorators: [{
+    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleInputWidget, selector: "keit-simple-input-widget", inputs: ["placeholder", "sample", "control", "size", "readonly", "hint", "iconRight", "cleaner", "hasEnter", "focused"], outputs: ["enter"] }, { kind: "component", type: SimpleTextareaWidget, selector: "keit-simple-textarea", inputs: ["placeholder", "sample", "control", "limit", "size", "cleaner"] }, { kind: "component", type: SimpleActionsWidget, selector: "keit-simple-actions", inputs: ["primaryIcon", "secondaryIcon", "disabled", "primaryCaption", "secondaryCaption", "hasSecondary", "size"], outputs: ["acceptEvent", "cancelEvent"] }, { kind: "component", type: SimpleFlexLayout, selector: "keit-simple-flex", inputs: ["gap", "direction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+};
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent$1, decorators: [{
             type: Component,
-            args: [{ selector: 'keit-name-component', imports: [
+            args: [{ selector: 'keit-name-description-component', imports: [
                         FormsModule,
                         ReactiveFormsModule,
                         TuiInput,
-                        SimpleInputWidget$1,
-                        SimpleTextareaWidget$1,
-                        SimpleActionsWidget$1,
-                        SimpleFlexLayout$1,
+                        SimpleInputWidget,
+                        SimpleTextareaWidget,
+                        SimpleActionsWidget,
+                        SimpleFlexLayout,
                     ], template: `
         <keit-simple-flex [gap]="8" direction="vertical">
-            <keit-simple-input-widget [control]="name" placeholder="Название" />
+            <keit-simple-input-widget
+                [control]="name"
+                placeholder="Название"
+                sample="Компот"
+            />
 
             <keit-simple-textarea
                 placeholder="Описание"
-                [limit]="1200"
+                [limit]="1024"
                 [control]="description"
                 [size]="'m'"
+                sample="Введите тут описание"
             />
 
             <keit-simple-actions
@@ -1543,16 +1725,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                 [disabled]="name.invalid || description.invalid"
             />
         </keit-simple-flex>
-    `, providers: [
-                        tuiValidationErrorsProvider({
-                            required: 'Требуется ввести',
-                            maxlength: ({ requiredLength }) => `Максимальная длина — ${requiredLength}`,
-                            minlength: ({ requiredLength }) => of(`Минимальная длина — ${requiredLength}`),
-                        }),
-                    ], changeDetection: ChangeDetectionStrategy.OnPush }]
+    `, providers: [validatorsProvider], changeDetection: ChangeDetectionStrategy.OnPush }]
         }] });
 
-class NameDialog {
+class NameDescriptionDialog {
     dialogs = inject(TuiDialogService);
     injector = inject(Injector);
     operation = input('create', ...(ngDevMode ? [{ debugName: "operation" }] : /* istanbul ignore next */ []));
@@ -1563,7 +1739,7 @@ class NameDialog {
     result = output();
     openDialog() {
         this.dialogs
-            .open(new PolymorpheusComponent(NameDescriptionComponent, this.injector), {
+            .open(new PolymorpheusComponent(NameDescriptionComponent$1, this.injector), {
             label: `${this.operation() === 'create' ? 'Добавить' : 'Редактировать'}`,
             size: 's',
             dismissible: false,
@@ -1577,8 +1753,8 @@ class NameDialog {
                 : null);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: NameDialog, isStandalone: true, selector: "keit-name-input-dialog", inputs: { operation: { classPropertyName: "operation", publicName: "operation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { result: "result" }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: NameDescriptionDialog, isStandalone: true, selector: "keit-name-description-input-dialog", inputs: { operation: { classPropertyName: "operation", publicName: "operation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { result: "result" }, ngImport: i0, template: `
         <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
         <keit-simple-button
             [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
@@ -1588,11 +1764,11 @@ class NameDialog {
             [disabled]="disabled()"
             (action)="openDialog()"
         />
-    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleButtonWidget$1, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleButtonWidget, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionDialog, decorators: [{
             type: Component,
-            args: [{ selector: 'keit-name-input-dialog', imports: [FormsModule, ReactiveFormsModule, TuiInput, SimpleButtonWidget$1], template: `
+            args: [{ selector: 'keit-name-description-input-dialog', imports: [FormsModule, ReactiveFormsModule, TuiInput, SimpleButtonWidget], template: `
         <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
         <keit-simple-button
             [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
@@ -1605,76 +1781,144 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
     `, changeDetection: ChangeDetectionStrategy.OnPush }]
         }], propDecorators: { operation: [{ type: i0.Input, args: [{ isSignal: true, alias: "operation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], result: [{ type: i0.Output, args: ["result"] }] } });
 
-class SimpleDateInputWidget {
-    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    sample = input('Введите...', ...(ngDevMode ? [{ debugName: "sample" }] : /* istanbul ignore next */ []));
-    control = input.required(...(ngDevMode ? [{ debugName: "control" }] : /* istanbul ignore next */ []));
-    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
-    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
-    iconRight = input('', ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
-    cleaner = input(...(ngDevMode ? [undefined, { debugName: "cleaner" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateInputWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: SimpleDateInputWidget, isStandalone: true, selector: "keit-simple-date-input-widget", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, cleaner: { classPropertyName: "cleaner", publicName: "cleaner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-        <tui-textfield
-            [tuiTextfieldSize]="size()"
-            [tuiTextfieldCleaner]="cleaner() ?? false"
-        >
-            <label tuiLabel>{{ placeholder() }}</label>
-            <input
-                tuiInputDateTime
-                [placeholder]="sample()"
-                [formControl]="control()"
-                [readOnly]="readonly()"
-            />
-            <tui-calendar *tuiDropdown />
-
-            @if (iconRight()) {
-                <tui-icon [icon]="iconRight()" />
-            }
-
-            @if (hint()) {
-                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
-            }
-        </tui-textfield>
-    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: i3$1.TuiTextfieldComponent, selector: "tui-textfield:not([multi])", inputs: ["content", "filler"] }, { kind: "directive", type: i3$1.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiDropdownContent, selector: "ng-template[tuiDropdown]" }, { kind: "directive", type: i2$1.TuiInputDateTimeDirective, selector: "input[tuiInputDateTime]", inputs: ["timeMode", "min", "max"] }, { kind: "component", type: i6.TuiCalendar, selector: "tui-calendar", inputs: ["disabledItemHandler", "min", "max", "minViewedMonth", "maxViewedMonth", "showAdjacent", "markerHandler", "initialView", "month", "hoveredItem", "value"], outputs: ["monthChange", "hoveredItemChange", "valueChange", "dayClick"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "directive", type: TuiTooltip, selector: "tui-icon[tuiTooltip]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateInputWidget, decorators: [{
-            type: Component,
-            args: [{ selector: 'keit-simple-date-input-widget', imports: [
-                        ReactiveFormsModule,
-                        FormsModule,
-                        TuiInput,
-                        TuiInputDateTime,
-                        TuiLabel,
-                        TuiIcon,
-                        TuiTooltip,
-                        TuiCalendar,
-                        TuiHint,
-                    ], template: `
-        <tui-textfield
-            [tuiTextfieldSize]="size()"
-            [tuiTextfieldCleaner]="cleaner() ?? false"
-        >
-            <label tuiLabel>{{ placeholder() }}</label>
-            <input
-                tuiInputDateTime
-                [placeholder]="sample()"
-                [formControl]="control()"
-                [readOnly]="readonly()"
+class NameDescriptionComponent {
+    context = injectContext();
+    name = KeitControl.create('')
+        .required()
+        .maxLength(30)
+        .minLength(2);
+    description = KeitControl.create('')
+        .required()
+        .maxLength(300)
+        .minLength(2);
+    cancel() {
+        this.name.reset();
+        this.description.reset();
+    }
+    accept() {
+        this.context.completeWith({
+            name: this.name.value,
+            description: this.description.value,
+        });
+        this.name.reset();
+        this.description.reset();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.8", type: NameDescriptionComponent, isStandalone: true, selector: "keit-name-component", providers: [
+            tuiValidationErrorsProvider({
+                required: 'Требуется ввести',
+                maxlength: ({ requiredLength }) => `Максимальная длина — ${requiredLength}`,
+                minlength: ({ requiredLength }) => of(`Минимальная длина — ${requiredLength}`),
+            }),
+        ], ngImport: i0, template: `
+        <keit-simple-flex [gap]="8" direction="vertical">
+            <keit-simple-input-widget [control]="name" placeholder="Название" />
+
+            <keit-simple-textarea
+                placeholder="Описание"
+                [limit]="1200"
+                [control]="description"
+                [size]="'m'"
             />
-            <tui-calendar *tuiDropdown />
 
-            @if (iconRight()) {
-                <tui-icon [icon]="iconRight()" />
-            }
+            <keit-simple-actions
+                [size]="'s'"
+                (cancelEvent)="cancel(); context.completeWith(null)"
+                (acceptEvent)="accept()"
+                [disabled]="name.invalid || description.invalid"
+            />
+        </keit-simple-flex>
+    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleInputWidget, selector: "keit-simple-input-widget", inputs: ["placeholder", "sample", "control", "size", "readonly", "hint", "iconRight", "cleaner", "hasEnter", "focused"], outputs: ["enter"] }, { kind: "component", type: SimpleTextareaWidget, selector: "keit-simple-textarea", inputs: ["placeholder", "sample", "control", "limit", "size", "cleaner"] }, { kind: "component", type: SimpleActionsWidget, selector: "keit-simple-actions", inputs: ["primaryIcon", "secondaryIcon", "disabled", "primaryCaption", "secondaryCaption", "hasSecondary", "size"], outputs: ["acceptEvent", "cancelEvent"] }, { kind: "component", type: SimpleFlexLayout, selector: "keit-simple-flex", inputs: ["gap", "direction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDescriptionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'keit-name-component', imports: [
+                        FormsModule,
+                        ReactiveFormsModule,
+                        TuiInput,
+                        SimpleInputWidget,
+                        SimpleTextareaWidget,
+                        SimpleActionsWidget,
+                        SimpleFlexLayout,
+                    ], template: `
+        <keit-simple-flex [gap]="8" direction="vertical">
+            <keit-simple-input-widget [control]="name" placeholder="Название" />
 
-            @if (hint()) {
-                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
-            }
-        </tui-textfield>
-    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
-        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], sample: [{ type: i0.Input, args: [{ isSignal: true, alias: "sample", required: false }] }], control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], cleaner: [{ type: i0.Input, args: [{ isSignal: true, alias: "cleaner", required: false }] }] } });
+            <keit-simple-textarea
+                placeholder="Описание"
+                [limit]="1200"
+                [control]="description"
+                [size]="'m'"
+            />
+
+            <keit-simple-actions
+                [size]="'s'"
+                (cancelEvent)="cancel(); context.completeWith(null)"
+                (acceptEvent)="accept()"
+                [disabled]="name.invalid || description.invalid"
+            />
+        </keit-simple-flex>
+    `, providers: [
+                        tuiValidationErrorsProvider({
+                            required: 'Требуется ввести',
+                            maxlength: ({ requiredLength }) => `Максимальная длина — ${requiredLength}`,
+                            minlength: ({ requiredLength }) => of(`Минимальная длина — ${requiredLength}`),
+                        }),
+                    ], changeDetection: ChangeDetectionStrategy.OnPush }]
+        }] });
+
+class NameDialog {
+    dialogs = inject(TuiDialogService);
+    injector = inject(Injector);
+    operation = input('create', ...(ngDevMode ? [{ debugName: "operation" }] : /* istanbul ignore next */ []));
+    disabled = input(...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
+    caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : /* istanbul ignore next */ []));
+    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    appearance = input('primary', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    result = output();
+    openDialog() {
+        this.dialogs
+            .open(new PolymorpheusComponent(NameDescriptionComponent, this.injector), {
+            label: `${this.operation() === 'create' ? 'Добавить' : 'Редактировать'}`,
+            size: 's',
+            dismissible: false,
+        })
+            .subscribe((data) => {
+            this.result.emit(data != null
+                ? {
+                    name: data.name,
+                    description: data.description,
+                }
+                : null);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: NameDialog, isStandalone: true, selector: "keit-name-input-dialog", inputs: { operation: { classPropertyName: "operation", publicName: "operation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { result: "result" }, ngImport: i0, template: `
+        <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+        <keit-simple-button
+            [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
+            [size]="size()"
+            [caption]="caption()"
+            [appearance]="appearance()"
+            [disabled]="disabled()"
+            (action)="openDialog()"
+        />
+    `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SimpleButtonWidget, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NameDialog, decorators: [{
+            type: Component,
+            args: [{ selector: 'keit-name-input-dialog', imports: [FormsModule, ReactiveFormsModule, TuiInput, SimpleButtonWidget], template: `
+        <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
+        <keit-simple-button
+            [icon]="operation() === 'create' ? '@tui.plus' : '@tui.edit'"
+            [size]="size()"
+            [caption]="caption()"
+            [appearance]="appearance()"
+            [disabled]="disabled()"
+            (action)="openDialog()"
+        />
+    `, changeDetection: ChangeDetectionStrategy.OnPush }]
+        }], propDecorators: { operation: [{ type: i0.Input, args: [{ isSignal: true, alias: "operation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], result: [{ type: i0.Output, args: ["result"] }] } });
 
 class ReloadOverlayWidget {
     reload = output();
@@ -1694,11 +1938,11 @@ class ReloadOverlayWidget {
                 <ng-content />
             }
         </div>
-    `, isInline: true, styles: [".overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background-color:#0009;z-index:1000;pointer-events:auto}::ng-deep keit-simple-button{z-index:1001}\n"], dependencies: [{ kind: "component", type: SimpleButtonWidget$1, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, styles: [".overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background-color:#0009;z-index:1000;pointer-events:auto}::ng-deep keit-simple-button{z-index:1001}\n"], dependencies: [{ kind: "component", type: SimpleButtonWidget, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ReloadOverlayWidget, decorators: [{
             type: Component,
-            args: [{ selector: 'keit-reload-overlay', imports: [SimpleButtonWidget$1], template: `
+            args: [{ selector: 'keit-reload-overlay', imports: [SimpleButtonWidget], template: `
         <div [class.overlay]="overlayed()">
             @if (overlayed()) {
                 <keit-simple-button
@@ -1715,251 +1959,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
     `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background-color:#0009;z-index:1000;pointer-events:auto}::ng-deep keit-simple-button{z-index:1001}\n"] }]
         }], propDecorators: { reload: [{ type: i0.Output, args: ["reload"] }], overlayed: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlayed", required: false }] }] } });
 
-class SimpleDateRangeInputWidget {
-    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    sample = input('Введите...', ...(ngDevMode ? [{ debugName: "sample" }] : /* istanbul ignore next */ []));
-    control = input.required(...(ngDevMode ? [{ debugName: "control" }] : /* istanbul ignore next */ []));
-    size = input('m', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
-    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
-    iconRight = input('', ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
-    cleaner = input(...(ngDevMode ? [undefined, { debugName: "cleaner" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateRangeInputWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: SimpleDateRangeInputWidget, isStandalone: true, selector: "keit-simple-date-range-input-widget", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, sample: { classPropertyName: "sample", publicName: "sample", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, cleaner: { classPropertyName: "cleaner", publicName: "cleaner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-        <tui-textfield
-            [tuiTextfieldSize]="size()"
-            [tuiTextfieldCleaner]="cleaner() ?? false"
-        >
-            <label tuiLabel>{{ placeholder() }}</label>
-            <input
-                tuiInputDateRange
-                [placeholder]="sample()"
-                [formControl]="control()"
-                [readOnly]="readonly()"
-            />
-            <tui-calendar-range *tuiDropdown />
-
-            @if (iconRight()) {
-                <tui-icon [icon]="iconRight()" />
-            }
-
-            @if (hint()) {
-                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
-            }
-        </tui-textfield>
-    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.TuiLabel, selector: "label[tuiLabel]" }, { kind: "component", type: i3$1.TuiTextfieldComponent, selector: "tui-textfield:not([multi])", inputs: ["content", "filler"] }, { kind: "directive", type: i3$1.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiDropdownContent, selector: "ng-template[tuiDropdown]" }, { kind: "directive", type: i2$1.TuiInputDateRangeDirective, selector: "input[tuiInputDateRange]", inputs: ["max", "min", "minLength", "maxLength"] }, { kind: "component", type: i6$1.TuiCalendarRange, selector: "tui-calendar-range", inputs: ["min", "max", "minLength", "maxLength", "items", "listSize", "defaultViewedMonth", "markerHandler", "disabledItemHandler", "value", "item"], outputs: ["valueChange", "itemChange"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "directive", type: TuiTooltip, selector: "tui-icon[tuiTooltip]", inputs: ["size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleDateRangeInputWidget, decorators: [{
-            type: Component,
-            args: [{ selector: 'keit-simple-date-range-input-widget', imports: [
-                        ReactiveFormsModule,
-                        FormsModule,
-                        TuiInput,
-                        TuiInputDateRange,
-                        TuiLabel,
-                        TuiIcon,
-                        TuiTooltip,
-                        TuiCalendarRange,
-                        TuiHint,
-                    ], template: `
-        <tui-textfield
-            [tuiTextfieldSize]="size()"
-            [tuiTextfieldCleaner]="cleaner() ?? false"
-        >
-            <label tuiLabel>{{ placeholder() }}</label>
-            <input
-                tuiInputDateRange
-                [placeholder]="sample()"
-                [formControl]="control()"
-                [readOnly]="readonly()"
-            />
-            <tui-calendar-range *tuiDropdown />
-
-            @if (iconRight()) {
-                <tui-icon [icon]="iconRight()" />
-            }
-
-            @if (hint()) {
-                <tui-icon [tuiTooltip]="hint()" tuiHintDirection="top-end" />
-            }
-        </tui-textfield>
-    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
-        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], sample: [{ type: i0.Input, args: [{ isSignal: true, alias: "sample", required: false }] }], control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], cleaner: [{ type: i0.Input, args: [{ isSignal: true, alias: "cleaner", required: false }] }] } });
-
-class SimplePaginationWidget {
-    page = input.required(...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
-    size = input.required(...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    total = input.required(...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
-    paginationChange = output();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimplePaginationWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SimplePaginationWidget, isStandalone: true, selector: "keit-simple-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { paginationChange: "paginationChange" }, providers: [tuiTablePaginationOptionsProvider({ showPages: false })], ngImport: i0, template: `
-        <tui-table-pagination
-            [page]="page()"
-            [size]="size()"
-            [total]="total()"
-            (paginationChange)="paginationChange.emit($event)"
-        />
-    `, isInline: true, styles: [":host{display:block;padding:16px}\n"], dependencies: [{ kind: "component", type: TuiTablePagination, selector: "tui-table-pagination", inputs: ["items", "total", "page", "size"], outputs: ["pageChange", "sizeChange", "paginationChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimplePaginationWidget, decorators: [{
-            type: Component,
-            args: [{ selector: 'keit-simple-pagination', imports: [TuiTablePagination], template: `
-        <tui-table-pagination
-            [page]="page()"
-            [size]="size()"
-            [total]="total()"
-            (paginationChange)="paginationChange.emit($event)"
-        />
-    `, providers: [tuiTablePaginationOptionsProvider({ showPages: false })], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;padding:16px}\n"] }]
-        }], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: true }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: true }] }], paginationChange: [{ type: i0.Output, args: ["paginationChange"] }] } });
-
-class NotificationWidget {
-    platformId = inject(PLATFORM_ID);
-    size = input('l', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    appearance = input('info', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
-    closable = input(true, ...(ngDevMode ? [{ debugName: "closable" }] : /* istanbul ignore next */ []));
-    closeLabel = input('Close', ...(ngDevMode ? [{ debugName: "closeLabel" }] : /* istanbul ignore next */ []));
-    closeEvent = output();
-    hideable = input(false, ...(ngDevMode ? [{ debugName: "hideable" }] : /* istanbul ignore next */ []));
-    hideButtonLabel = input('Больше не показывать', ...(ngDevMode ? [{ debugName: "hideButtonLabel" }] : /* istanbul ignore next */ []));
-    hideButtonAppearance = input('flat', ...(ngDevMode ? [{ debugName: "hideButtonAppearance" }] : /* istanbul ignore next */ []));
-    hideButtonSize = input('s', ...(ngDevMode ? [{ debugName: "hideButtonSize" }] : /* istanbul ignore next */ []));
-    storageKey = input(...(ngDevMode ? [undefined, { debugName: "storageKey" }] : /* istanbul ignore next */ []));
-    shouldShow = signal(true, ...(ngDevMode ? [{ debugName: "shouldShow" }] : /* istanbul ignore next */ []));
-    constructor() {
-        effect(() => {
-            const key = this.storageKey();
-            if (key && isPlatformBrowser(this.platformId)) {
-                const hidden = localStorage.getItem(`notification-hide-${key}`);
-                this.shouldShow.set(!hidden);
-            }
-        });
-    }
-    hideForever() {
-        const key = this.storageKey();
-        if (key && isPlatformBrowser(this.platformId)) {
-            localStorage.setItem(`notification-hide-${key}`, 'true');
-            this.shouldShow.set(false);
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NotificationWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NotificationWidget, isStandalone: true, selector: "keit-notification-widget", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, hideable: { classPropertyName: "hideable", publicName: "hideable", isSignal: true, isRequired: false, transformFunction: null }, hideButtonLabel: { classPropertyName: "hideButtonLabel", publicName: "hideButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, hideButtonAppearance: { classPropertyName: "hideButtonAppearance", publicName: "hideButtonAppearance", isSignal: true, isRequired: false, transformFunction: null }, hideButtonSize: { classPropertyName: "hideButtonSize", publicName: "hideButtonSize", isSignal: true, isRequired: false, transformFunction: null }, storageKey: { classPropertyName: "storageKey", publicName: "storageKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: `
-        @if (shouldShow()) {
-            <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-            <div tuiNotification [size]="size()" [appearance]="appearance()">
-                <p class="text"><ng-content></ng-content></p>
-                @if (hideable()) {
-                    <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-                    <keit-simple-button
-                        [appearance]="hideButtonAppearance()"
-                        [size]="hideButtonSize()"
-                        [caption]="hideButtonLabel()"
-                        (action)="hideForever()"
-                    />
-                }
-                @if (closable()) {
-                    <button
-                        iconStart="@tui.x"
-                        tuiIconButton
-                        type="button"
-                        (click)="shouldShow.set(false)"
-                    >
-                        {{ closeLabel() }}
-                    </button>
-                }
-            </div>
-        }
-    `, isInline: true, styles: [":host{display:block;margin-bottom:8px}.text{font-size:12px;padding:8px 8px 0}\n"], dependencies: [{ kind: "directive", type: i3.TuiNotificationDirective, selector: "[tuiNotification]:not(ng-template)", inputs: ["appearance", "size", "icon"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: SimpleButtonWidget, selector: "keit-simple-button", inputs: ["icon", "iconRight", "disabled", "caption", "ariaLabel", "size", "appearance"], outputs: ["action"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NotificationWidget, decorators: [{
-            type: Component,
-            args: [{ selector: 'keit-notification-widget', imports: [TuiNotification, TuiButton, SimpleButtonWidget], template: `
-        @if (shouldShow()) {
-            <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-            <div tuiNotification [size]="size()" [appearance]="appearance()">
-                <p class="text"><ng-content></ng-content></p>
-                @if (hideable()) {
-                    <!-- TODO: (Taiga UI migration) [appearance] binding uses a dynamic expression. If it can produce "error"/"success"/"glass", replace with "negative"/"positive"/"secondary-grayscale" -->
-                    <keit-simple-button
-                        [appearance]="hideButtonAppearance()"
-                        [size]="hideButtonSize()"
-                        [caption]="hideButtonLabel()"
-                        (action)="hideForever()"
-                    />
-                }
-                @if (closable()) {
-                    <button
-                        iconStart="@tui.x"
-                        tuiIconButton
-                        type="button"
-                        (click)="shouldShow.set(false)"
-                    >
-                        {{ closeLabel() }}
-                    </button>
-                }
-            </div>
-        }
-    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;margin-bottom:8px}.text{font-size:12px;padding:8px 8px 0}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], closeEvent: [{ type: i0.Output, args: ["closeEvent"] }], hideable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideable", required: false }] }], hideButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonLabel", required: false }] }], hideButtonAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonAppearance", required: false }] }], hideButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideButtonSize", required: false }] }], storageKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "storageKey", required: false }] }] } });
-
-class SimpleCalendarWidget {
-    markerConditionFn = input(null, ...(ngDevMode ? [{ debugName: "markerConditionFn" }] : /* istanbul ignore next */ []));
-    initialMonth = input(null, ...(ngDevMode ? [{ debugName: "initialMonth" }] : /* istanbul ignore next */ []));
-    initialDay = input(null, ...(ngDevMode ? [{ debugName: "initialDay" }] : /* istanbul ignore next */ []));
-    selectDay = output();
-    selectMonth = output();
-    value = null;
-    selectedMonth = TuiMonth.currentLocal();
-    hoveredItem = null;
-    ngOnInit() {
-        const initialMonth = this.initialMonth();
-        if (initialMonth) {
-            this.selectedMonth = initialMonth;
-            this.value = new TuiDay(this.selectedMonth.year, this.selectedMonth.month, 1);
-        }
-        const initialDay = this.initialDay();
-        if (initialDay) {
-            this.value = initialDay;
-        }
-    }
-    onDayClick(day) {
-        this.value = day;
-        this.selectDay.emit(day);
-    }
-    onMonthChange(month) {
-        this.selectedMonth = month;
-        this.selectMonth.emit(month);
-        this.value = new TuiDay(month.year, month.month, 1);
-        this.selectDay.emit(this.value);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleCalendarWidget, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.8", type: SimpleCalendarWidget, isStandalone: true, selector: "keit-simple-calendar-widget", inputs: { markerConditionFn: { classPropertyName: "markerConditionFn", publicName: "markerConditionFn", isSignal: true, isRequired: false, transformFunction: null }, initialMonth: { classPropertyName: "initialMonth", publicName: "initialMonth", isSignal: true, isRequired: false, transformFunction: null }, initialDay: { classPropertyName: "initialDay", publicName: "initialDay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectDay: "selectDay", selectMonth: "selectMonth" }, ngImport: i0, template: `
-        <tui-calendar
-            [markerHandler]="this.markerConditionFn()"
-            [month]="selectedMonth"
-            [showAdjacent]="false"
-            [value]="value"
-            [(hoveredItem)]="hoveredItem"
-            (dayClick)="onDayClick($event)"
-            (monthChange)="onMonthChange($event)"
-        />
-    `, isInline: true, styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: TuiCalendar, selector: "tui-calendar", inputs: ["disabledItemHandler", "min", "max", "minViewedMonth", "maxViewedMonth", "showAdjacent", "markerHandler", "initialView", "month", "hoveredItem", "value"], outputs: ["monthChange", "hoveredItemChange", "valueChange", "dayClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: SimpleCalendarWidget, decorators: [{
-            type: Component,
-            args: [{ selector: 'keit-simple-calendar-widget', imports: [ReactiveFormsModule, FormsModule, TuiCalendar], template: `
-        <tui-calendar
-            [markerHandler]="this.markerConditionFn()"
-            [month]="selectedMonth"
-            [showAdjacent]="false"
-            [value]="value"
-            [(hoveredItem)]="hoveredItem"
-            (dayClick)="onDayClick($event)"
-            (monthChange)="onMonthChange($event)"
-        />
-    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
-        }], propDecorators: { markerConditionFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "markerConditionFn", required: false }] }], initialMonth: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialMonth", required: false }] }], initialDay: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialDay", required: false }] }], selectDay: [{ type: i0.Output, args: ["selectDay"] }], selectMonth: [{ type: i0.Output, args: ["selectMonth"] }] } });
-
 /*
  * Public API Surface of widgets
  */