@cuby-ui/core 0.0.341 → 0.0.343
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/badge/badge.component.d.ts +1 -1
- package/components/badge/badge.options.d.ts +2 -1
- package/components/badge/index.d.ts +1 -0
- package/components/dialog/dialog-header/dialog-header.component.d.ts +5 -6
- package/editor/widgets/editor-readonly/editor-readonly.component.d.ts +1 -2
- package/editor/widgets/editor-readonly/editor-resize-observer.directive.d.ts +15 -0
- package/esm2022/components/badge/badge.options.mjs +1 -1
- package/esm2022/components/badge/index.mjs +1 -1
- package/esm2022/components/dialog/dialog-header/dialog-header.component.mjs +1 -1
- package/esm2022/editor/widgets/editor-readonly/editor-readonly.component.mjs +8 -12
- package/esm2022/editor/widgets/editor-readonly/editor-resize-observer.directive.mjs +51 -0
- package/fesm2022/cuby-ui-core.mjs +54 -11
- package/fesm2022/cuby-ui-core.mjs.map +1 -1
- package/package.json +4 -4
|
@@ -2,7 +2,7 @@ import type { CuiBadgeOptions } from './badge.options';
|
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export declare class CuiBadgeComponent implements CuiBadgeOptions {
|
|
4
4
|
private readonly options;
|
|
5
|
-
color: "
|
|
5
|
+
color: import("./badge.options").CuiBadgeColor;
|
|
6
6
|
size: "sm" | "md";
|
|
7
7
|
isWithDot: boolean;
|
|
8
8
|
static ɵfac: i0.ɵɵFactoryDeclaration<CuiBadgeComponent, never>;
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import type { CuiSizeMd, CuiSizeSm } from '../../types';
|
|
2
2
|
export interface CuiBadgeOptions {
|
|
3
|
-
readonly color:
|
|
3
|
+
readonly color: CuiBadgeColor;
|
|
4
4
|
readonly size: CuiSizeSm | CuiSizeMd;
|
|
5
5
|
readonly isWithDot: boolean;
|
|
6
6
|
}
|
|
7
|
+
export type CuiBadgeColor = 'light-blue' | 'yellow' | 'green' | 'gray' | 'dark-gray' | 'red' | 'violet' | 'orange';
|
|
7
8
|
export declare const CUI_BADGE_DEFAULT_OPTIONS: CuiBadgeOptions;
|
|
8
9
|
export declare const CUI_BADGE_OPTIONS: import("@angular/core").InjectionToken<CuiBadgeOptions>;
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import { EventEmitter } from '@angular/core';
|
|
2
|
-
import
|
|
3
|
-
import { PolymorpheusContext } from '@taiga-ui/polymorpheus/classes/context';
|
|
2
|
+
import { PolymorpheusContent } from '@taiga-ui/polymorpheus';
|
|
4
3
|
import * as i0 from "@angular/core";
|
|
5
|
-
export declare class CuiDialogHeaderComponent {
|
|
4
|
+
export declare class CuiDialogHeaderComponent<T> {
|
|
6
5
|
heading: PolymorpheusContent;
|
|
7
|
-
headingContext?:
|
|
6
|
+
headingContext?: T;
|
|
8
7
|
subheading?: string;
|
|
9
8
|
readonly closed: EventEmitter<MouseEvent>;
|
|
10
9
|
protected onClose(event: MouseEvent): void;
|
|
11
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<CuiDialogHeaderComponent
|
|
12
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<CuiDialogHeaderComponent
|
|
10
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CuiDialogHeaderComponent<any>, never>;
|
|
11
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CuiDialogHeaderComponent<any>, "header[cuiDialogHeader][heading]", never, { "heading": { "alias": "heading"; "required": false; }; "headingContext": { "alias": "headingContext"; "required": false; }; "subheading": { "alias": "subheading"; "required": false; }; }, { "closed": "closed"; }, never, ["*"], false, never>;
|
|
13
12
|
}
|
|
@@ -3,7 +3,6 @@ import { CuiEditorComponent } from '../../editor.component';
|
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export declare class CuiEditorReadonlyComponent {
|
|
5
5
|
protected readonly isShowMore: import("@angular/core").WritableSignal<boolean>;
|
|
6
|
-
protected readonly isMoreButtonShown: import("@angular/core").WritableSignal<boolean>;
|
|
7
6
|
protected readonly editorConfig: import("@angular/core").Signal<{
|
|
8
7
|
tools?: import("@cuby-ui/core").CuiTools;
|
|
9
8
|
readOnly: boolean;
|
|
@@ -14,6 +13,7 @@ export declare class CuiEditorReadonlyComponent {
|
|
|
14
13
|
readonlyPlaceholder?: string;
|
|
15
14
|
requestOptions?: import("@cuby-ui/core").CuiRequestOptions;
|
|
16
15
|
}>;
|
|
16
|
+
protected readonly DEFAULT_SHORT_HEIGHT = 68;
|
|
17
17
|
protected readonly editor: import("@angular/core").Signal<CuiEditorComponent>;
|
|
18
18
|
readonly editorId: import("@angular/core").InputSignal<string>;
|
|
19
19
|
readonly config: import("@angular/core").InputSignal<import("@cuby-ui/core").CuiEditorConfig>;
|
|
@@ -21,7 +21,6 @@ export declare class CuiEditorReadonlyComponent {
|
|
|
21
21
|
readonly shortHeight: import("@angular/core").InputSignal<number>;
|
|
22
22
|
constructor();
|
|
23
23
|
protected onShow(editor: CuiEditorComponent): void;
|
|
24
|
-
private initReadEditorProperty;
|
|
25
24
|
private initEditorIdEffect;
|
|
26
25
|
static ɵfac: i0.ɵɵFactoryDeclaration<CuiEditorReadonlyComponent, never>;
|
|
27
26
|
static ɵcmp: i0.ɵɵComponentDeclaration<CuiEditorReadonlyComponent, "cui-editor-readonly", never, { "editorId": { "alias": "editorId"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": true; "isSignal": true; }; "buttonTemplate": { "alias": "buttonTemplate"; "required": true; "isSignal": true; }; "shortHeight": { "alias": "shortHeight"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
export declare class EditorResizeObserverDirective {
|
|
3
|
+
private readonly templateRef;
|
|
4
|
+
private readonly viewContainerRef;
|
|
5
|
+
private observer;
|
|
6
|
+
readonly target: import("@angular/core").InputSignal<HTMLElement>;
|
|
7
|
+
readonly shortHeight: import("@angular/core").InputSignal<number>;
|
|
8
|
+
constructor();
|
|
9
|
+
ngOnDestroy(): void;
|
|
10
|
+
private initTargetEffect;
|
|
11
|
+
private initObserver;
|
|
12
|
+
private destroyObserver;
|
|
13
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<EditorResizeObserverDirective, never>;
|
|
14
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<EditorResizeObserverDirective, "[editorResizeObserver]", never, { "target": { "alias": "target"; "required": true; "isSignal": true; }; "shortHeight": { "alias": "shortHeight"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
15
|
+
}
|
|
@@ -5,4 +5,4 @@ export const CUI_BADGE_DEFAULT_OPTIONS = {
|
|
|
5
5
|
isWithDot: false
|
|
6
6
|
};
|
|
7
7
|
export const CUI_BADGE_OPTIONS = cuiCreateToken(CUI_BADGE_DEFAULT_OPTIONS);
|
|
8
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
8
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2Uub3B0aW9ucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvcmUvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5vcHRpb25zLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFZOUMsTUFBTSxDQUFDLE1BQU0seUJBQXlCLEdBQW9CO0lBQ3RELEtBQUssRUFBRSxZQUFZO0lBQ25CLElBQUksRUFBRSxJQUFJO0lBQ1YsU0FBUyxFQUFFLEtBQUs7Q0FDbkIsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLGNBQWMsQ0FBQyx5QkFBeUIsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3VpQ3JlYXRlVG9rZW4gfSBmcm9tICdAY3VieS11aS9jZGsnO1xuXG5pbXBvcnQgdHlwZSB7IEN1aVNpemVNZCwgQ3VpU2l6ZVNtIH0gZnJvbSAnLi4vLi4vdHlwZXMnO1xuXG5leHBvcnQgaW50ZXJmYWNlIEN1aUJhZGdlT3B0aW9ucyB7XG4gICAgcmVhZG9ubHkgY29sb3I6IEN1aUJhZGdlQ29sb3I7XG4gICAgcmVhZG9ubHkgc2l6ZTogQ3VpU2l6ZVNtIHwgQ3VpU2l6ZU1kO1xuICAgIHJlYWRvbmx5IGlzV2l0aERvdDogYm9vbGVhbjtcbn1cblxuZXhwb3J0IHR5cGUgQ3VpQmFkZ2VDb2xvciA9ICdsaWdodC1ibHVlJyB8ICd5ZWxsb3cnIHwgJ2dyZWVuJyB8ICdncmF5JyB8ICdkYXJrLWdyYXknIHwgJ3JlZCcgfCAndmlvbGV0JyB8ICdvcmFuZ2UnO1xuXG5leHBvcnQgY29uc3QgQ1VJX0JBREdFX0RFRkFVTFRfT1BUSU9OUzogQ3VpQmFkZ2VPcHRpb25zID0ge1xuICAgIGNvbG9yOiAnbGlnaHQtYmx1ZScsXG4gICAgc2l6ZTogJ3NtJyxcbiAgICBpc1dpdGhEb3Q6IGZhbHNlXG59O1xuXG5leHBvcnQgY29uc3QgQ1VJX0JBREdFX09QVElPTlMgPSBjdWlDcmVhdGVUb2tlbihDVUlfQkFER0VfREVGQVVMVF9PUFRJT05TKTtcbiJdfQ==
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export * from './badge.component';
|
|
2
2
|
export * from './badge.module';
|
|
3
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
3
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2NvbXBvbmVudHMvYmFkZ2UvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxtQkFBbUIsQ0FBQztBQUNsQyxjQUFjLGdCQUFnQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9iYWRnZS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9iYWRnZS5tb2R1bGUnO1xuZXhwb3J0IHsgQ3VpQmFkZ2VDb2xvciwgQ3VpQmFkZ2VPcHRpb25zIH0gZnJvbSAnLi9iYWRnZS5vcHRpb25zJztcbiJdfQ==
|
|
@@ -25,4 +25,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
25
25
|
}], closed: [{
|
|
26
26
|
type: Output
|
|
27
27
|
}] } });
|
|
28
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
28
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLWhlYWRlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2NvbXBvbmVudHMvZGlhbG9nL2RpYWxvZy1oZWFkZXIvZGlhbG9nLWhlYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2NvbXBvbmVudHMvZGlhbG9nL2RpYWxvZy1oZWFkZXIvZGlhbG9nLWhlYWRlci50ZW1wbGF0ZS5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7O0FBVWhHLE1BQU0sT0FBTyx3QkFBd0I7SUFOckM7UUFpQm9CLFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBYyxDQUFDO0tBSzNEO0lBSGEsT0FBTyxDQUFDLEtBQWlCO1FBQy9CLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzVCLENBQUM7K0dBZlEsd0JBQXdCO21HQUF4Qix3QkFBd0IsbU1DVnJDLHdYQWFBOzs0RkRIYSx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0ksa0NBQWtDLG1CQUczQix1QkFBdUIsQ0FBQyxNQUFNOzhCQUl4QyxPQUFPO3NCQURiLEtBQUs7Z0JBSUMsY0FBYztzQkFEcEIsS0FBSztnQkFJQyxVQUFVO3NCQURoQixLQUFLO2dCQUlVLE1BQU07c0JBRHJCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFBvbHltb3JwaGV1c0NvbnRlbnQgfSBmcm9tICdAdGFpZ2EtdWkvcG9seW1vcnBoZXVzJztcbmltcG9ydCB7IFBvbHltb3JwaGV1c0NvbnRleHQgfSBmcm9tICdAdGFpZ2EtdWkvcG9seW1vcnBoZXVzL2NsYXNzZXMvY29udGV4dCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnaGVhZGVyW2N1aURpYWxvZ0hlYWRlcl1baGVhZGluZ10nLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9kaWFsb2ctaGVhZGVyLnRlbXBsYXRlLmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2RpYWxvZy1oZWFkZXIuc3R5bGUuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuZXhwb3J0IGNsYXNzIEN1aURpYWxvZ0hlYWRlckNvbXBvbmVudDxUPiB7XG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgaGVhZGluZyE6IFBvbHltb3JwaGV1c0NvbnRlbnQ7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBoZWFkaW5nQ29udGV4dD86IFQ7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBzdWJoZWFkaW5nPzogc3RyaW5nO1xuXG4gICAgQE91dHB1dCgpXG4gICAgcHVibGljIHJlYWRvbmx5IGNsb3NlZCA9IG5ldyBFdmVudEVtaXR0ZXI8TW91c2VFdmVudD4oKTtcblxuICAgIHByb3RlY3RlZCBvbkNsb3NlKGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XG4gICAgICAgIHRoaXMuY2xvc2VkLmVtaXQoZXZlbnQpO1xuICAgIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJjLWhlYWRpbmdcIj5cbiAgPG5nLWNvbnRhaW5lciAqcG9seW1vcnBoZXVzT3V0bGV0PVwiaGVhZGluZyBhcyBoZWFkaW5nOyBjb250ZXh0OiBoZWFkaW5nQ29udGV4dFwiPnt7IGhlYWRpbmcgfX08L25nLWNvbnRhaW5lcj5cbjwvZGl2PlxuPGJ1dHRvblxuICBjdWlCdXR0b25cbiAgdHlwZT1cImJ1dHRvblwiXG4gIGFwcGVhcmFuY2U9XCJnaG9zdFwiXG4gIGljb249XCJjdWlJY29uQ2xlYXJTbVwiXG4gIGNsYXNzPVwiYy1idXR0b25cIlxuICAoY2xpY2spPVwib25DbG9zZSgkZXZlbnQpXCJcbj48L2J1dHRvbj5cbjxzcGFuICpuZ0lmPVwic3ViaGVhZGluZ1wiPnt7IHN1YmhlYWRpbmcgfX08L3NwYW4+XG48bmctY29udGVudCAvPlxuIl19
|
|
@@ -1,29 +1,25 @@
|
|
|
1
1
|
import { NgTemplateOutlet } from '@angular/common';
|
|
2
|
-
import {
|
|
2
|
+
import { ChangeDetectionStrategy, Component, computed, effect, input, signal, viewChild } from '@angular/core';
|
|
3
|
+
import { CuiElementDirective } from '@cuby-ui/cdk';
|
|
3
4
|
import { CuiEditorComponent } from '../../editor.component';
|
|
5
|
+
import { EditorResizeObserverDirective } from './editor-resize-observer.directive';
|
|
4
6
|
import * as i0 from "@angular/core";
|
|
5
7
|
export class CuiEditorReadonlyComponent {
|
|
6
8
|
constructor() {
|
|
7
9
|
this.isShowMore = signal(false);
|
|
8
|
-
this.isMoreButtonShown = signal(false);
|
|
9
10
|
this.editorConfig = computed(() => ({ readOnly: true, withoutPreload: true, ...this.config() }));
|
|
11
|
+
this.DEFAULT_SHORT_HEIGHT = 68;
|
|
10
12
|
this.editor = viewChild.required('editor');
|
|
11
13
|
this.editorId = input.required();
|
|
12
14
|
this.config = input.required();
|
|
13
15
|
this.buttonTemplate = input.required();
|
|
14
|
-
this.shortHeight = input(
|
|
16
|
+
this.shortHeight = input(this.DEFAULT_SHORT_HEIGHT);
|
|
15
17
|
this.initEditorIdEffect();
|
|
16
|
-
this.initReadEditorProperty();
|
|
17
18
|
}
|
|
18
19
|
onShow(editor) {
|
|
19
20
|
editor.editorElement.scrollTo(0, 0);
|
|
20
21
|
this.isShowMore.update((prev) => !prev);
|
|
21
22
|
}
|
|
22
|
-
initReadEditorProperty() {
|
|
23
|
-
afterRender({
|
|
24
|
-
read: () => this.isMoreButtonShown.set(this.editor().editorElement?.scrollHeight > this.shortHeight())
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
23
|
initEditorIdEffect() {
|
|
28
24
|
effect(() => {
|
|
29
25
|
this.editorId();
|
|
@@ -31,10 +27,10 @@ export class CuiEditorReadonlyComponent {
|
|
|
31
27
|
}, { allowSignalWrites: true });
|
|
32
28
|
}
|
|
33
29
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiEditorReadonlyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
34
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
30
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: CuiEditorReadonlyComponent, isStandalone: true, selector: "cui-editor-readonly", inputs: { editorId: { classPropertyName: "editorId", publicName: "editorId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, buttonTemplate: { classPropertyName: "buttonTemplate", publicName: "buttonTemplate", isSignal: true, isRequired: true, transformFunction: null }, shortHeight: { classPropertyName: "shortHeight", publicName: "shortHeight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, isSignal: true }], ngImport: i0, template: "<cui-editor\r\n cuiElement\r\n #editorElement=\"elementRef\"\r\n #editorComponent\r\n class=\"editor\"\r\n [class.editor_opened]=\"isShowMore()\"\r\n [editorApiId]=\"editorId()\"\r\n [config]=\"editorConfig()\"\r\n/>\r\n\r\n<ng-template [editorResizeObserver] [target]=\"editorElement.nativeElement\" [shortHeight]=\"shortHeight()\">\r\n <button class=\"c-button\" (click)=\"onShow(editorComponent)\">\r\n <ng-container [ngTemplateOutlet]=\"buttonTemplate()\" [ngTemplateOutletContext]=\"{ $implicit: isShowMore }\"></ng-container>\r\n </button>\r\n</ng-template>\r\n", styles: [":host{--height: 69px;--fullHeight: 500px;display:flex;flex-direction:column;gap:8px}:host .editor{display:block;max-height:var(--height);overflow:hidden}:host .editor ::ng-deep [data-editor]{overflow:hidden}:host .editor_opened{max-height:var(--fullHeight)}:host .editor_opened ::ng-deep [data-editor]{max-height:var(--fullHeight);overflow:hidden auto}.c-button{padding:0}\n"], dependencies: [{ kind: "component", type: CuiEditorComponent, selector: "cui-editor", inputs: ["editorApiId", "config", "requestSize"], outputs: ["editorEmpty"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EditorResizeObserverDirective, selector: "[editorResizeObserver]", inputs: ["target", "shortHeight"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
35
31
|
}
|
|
36
32
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiEditorReadonlyComponent, decorators: [{
|
|
37
33
|
type: Component,
|
|
38
|
-
args: [{ selector: 'cui-editor-readonly', standalone: true, imports: [CuiEditorComponent, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-editor\r\n #
|
|
34
|
+
args: [{ selector: 'cui-editor-readonly', standalone: true, imports: [CuiEditorComponent, NgTemplateOutlet, EditorResizeObserverDirective, CuiElementDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-editor\r\n cuiElement\r\n #editorElement=\"elementRef\"\r\n #editorComponent\r\n class=\"editor\"\r\n [class.editor_opened]=\"isShowMore()\"\r\n [editorApiId]=\"editorId()\"\r\n [config]=\"editorConfig()\"\r\n/>\r\n\r\n<ng-template [editorResizeObserver] [target]=\"editorElement.nativeElement\" [shortHeight]=\"shortHeight()\">\r\n <button class=\"c-button\" (click)=\"onShow(editorComponent)\">\r\n <ng-container [ngTemplateOutlet]=\"buttonTemplate()\" [ngTemplateOutletContext]=\"{ $implicit: isShowMore }\"></ng-container>\r\n </button>\r\n</ng-template>\r\n", styles: [":host{--height: 69px;--fullHeight: 500px;display:flex;flex-direction:column;gap:8px}:host .editor{display:block;max-height:var(--height);overflow:hidden}:host .editor ::ng-deep [data-editor]{overflow:hidden}:host .editor_opened{max-height:var(--fullHeight)}:host .editor_opened ::ng-deep [data-editor]{max-height:var(--fullHeight);overflow:hidden auto}.c-button{padding:0}\n"] }]
|
|
39
35
|
}], ctorParameters: () => [] });
|
|
40
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
36
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLXJlYWRvbmx5LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvcmUvZWRpdG9yL3dpZGdldHMvZWRpdG9yLXJlYWRvbmx5L2VkaXRvci1yZWFkb25seS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2VkaXRvci93aWRnZXRzL2VkaXRvci1yZWFkb25seS9lZGl0b3ItcmVhZG9ubHkuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDbkQsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsUUFBUSxFQUNSLE1BQU0sRUFDTixLQUFLLEVBQ0wsTUFBTSxFQUVOLFNBQVMsRUFDWixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFFbkQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFFNUQsT0FBTyxFQUFFLDZCQUE2QixFQUFFLE1BQU0sb0NBQW9DLENBQUM7O0FBVW5GLE1BQU0sT0FBTywwQkFBMEI7SUFhbkM7UUFabUIsZUFBVSxHQUFHLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMzQixpQkFBWSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxDQUFDLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRSxjQUFjLEVBQUUsSUFBSSxFQUFFLEdBQUcsSUFBSSxDQUFDLE1BQU0sRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRTVGLHlCQUFvQixHQUFHLEVBQUUsQ0FBQztRQUUxQixXQUFNLEdBQUcsU0FBUyxDQUFDLFFBQVEsQ0FBcUIsUUFBUSxDQUFDLENBQUM7UUFFN0QsYUFBUSxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQVUsQ0FBQztRQUNwQyxXQUFNLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBMkIsQ0FBQztRQUNuRCxtQkFBYyxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQXdCLENBQUM7UUFDeEQsZ0JBQVcsR0FBRyxLQUFLLENBQVMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLENBQUM7UUFHbkUsSUFBSSxDQUFDLGtCQUFrQixFQUFFLENBQUM7SUFDOUIsQ0FBQztJQUVTLE1BQU0sQ0FBQyxNQUEwQjtRQUN2QyxNQUFNLENBQUMsYUFBYSxDQUFDLFFBQVEsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFDcEMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxNQUFNLENBQUMsQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVPLGtCQUFrQjtRQUN0QixNQUFNLENBQUMsR0FBRyxFQUFFO1lBQ1IsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDO1lBQ2hCLElBQUksQ0FBQyxVQUFVLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQy9CLENBQUMsRUFBRSxFQUFFLGlCQUFpQixFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7SUFDcEMsQ0FBQzsrR0EzQlEsMEJBQTBCO21HQUExQiwwQkFBMEIsbXVCQ3pCdkMsMmxCQWVBLGdiREtjLGtCQUFrQixtSUFBRSxnQkFBZ0Isb0pBQUUsNkJBQTZCLHNHQUFFLG1CQUFtQjs7NEZBS3pGLDBCQUEwQjtrQkFSdEMsU0FBUzsrQkFDSSxxQkFBcUIsY0FDbkIsSUFBSSxXQUNQLENBQUMsa0JBQWtCLEVBQUUsZ0JBQWdCLEVBQUUsNkJBQTZCLEVBQUUsbUJBQW1CLENBQUMsbUJBR2xGLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ1RlbXBsYXRlT3V0bGV0IH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHtcclxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxyXG4gICAgQ29tcG9uZW50LFxyXG4gICAgY29tcHV0ZWQsXHJcbiAgICBlZmZlY3QsXHJcbiAgICBpbnB1dCxcclxuICAgIHNpZ25hbCxcclxuICAgIFRlbXBsYXRlUmVmLFxyXG4gICAgdmlld0NoaWxkXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEN1aUVsZW1lbnREaXJlY3RpdmUgfSBmcm9tICdAY3VieS11aS9jZGsnO1xyXG5cclxuaW1wb3J0IHsgQ3VpRWRpdG9yQ29tcG9uZW50IH0gZnJvbSAnLi4vLi4vZWRpdG9yLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEN1aUVkaXRvclJlYWRvbmx5Q29uZmlnIH0gZnJvbSAnLi9lZGl0b3ItcmVhZG9ubHkub3B0aW9ucyc7XHJcbmltcG9ydCB7IEVkaXRvclJlc2l6ZU9ic2VydmVyRGlyZWN0aXZlIH0gZnJvbSAnLi9lZGl0b3ItcmVzaXplLW9ic2VydmVyLmRpcmVjdGl2ZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnY3VpLWVkaXRvci1yZWFkb25seScsXHJcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxyXG4gICAgaW1wb3J0czogW0N1aUVkaXRvckNvbXBvbmVudCwgTmdUZW1wbGF0ZU91dGxldCwgRWRpdG9yUmVzaXplT2JzZXJ2ZXJEaXJlY3RpdmUsIEN1aUVsZW1lbnREaXJlY3RpdmVdLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2VkaXRvci1yZWFkb25seS5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9lZGl0b3ItcmVhZG9ubHkuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDdWlFZGl0b3JSZWFkb25seUNvbXBvbmVudCB7XHJcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgaXNTaG93TW9yZSA9IHNpZ25hbChmYWxzZSk7XHJcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgZWRpdG9yQ29uZmlnID0gY29tcHV0ZWQoKCkgPT4gKHsgcmVhZE9ubHk6IHRydWUsIHdpdGhvdXRQcmVsb2FkOiB0cnVlLCAuLi50aGlzLmNvbmZpZygpIH0pKTtcclxuXHJcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgREVGQVVMVF9TSE9SVF9IRUlHSFQgPSA2ODtcclxuXHJcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgZWRpdG9yID0gdmlld0NoaWxkLnJlcXVpcmVkPEN1aUVkaXRvckNvbXBvbmVudD4oJ2VkaXRvcicpO1xyXG5cclxuICAgIHB1YmxpYyByZWFkb25seSBlZGl0b3JJZCA9IGlucHV0LnJlcXVpcmVkPHN0cmluZz4oKTtcclxuICAgIHB1YmxpYyByZWFkb25seSBjb25maWcgPSBpbnB1dC5yZXF1aXJlZDxDdWlFZGl0b3JSZWFkb25seUNvbmZpZz4oKTtcclxuICAgIHB1YmxpYyByZWFkb25seSBidXR0b25UZW1wbGF0ZSA9IGlucHV0LnJlcXVpcmVkPFRlbXBsYXRlUmVmPHVua25vd24+PigpO1xyXG4gICAgcHVibGljIHJlYWRvbmx5IHNob3J0SGVpZ2h0ID0gaW5wdXQ8bnVtYmVyPih0aGlzLkRFRkFVTFRfU0hPUlRfSEVJR0hUKTtcclxuXHJcbiAgICBjb25zdHJ1Y3RvcigpIHtcclxuICAgICAgICB0aGlzLmluaXRFZGl0b3JJZEVmZmVjdCgpO1xyXG4gICAgfVxyXG5cclxuICAgIHByb3RlY3RlZCBvblNob3coZWRpdG9yOiBDdWlFZGl0b3JDb21wb25lbnQpOiB2b2lkIHtcclxuICAgICAgICBlZGl0b3IuZWRpdG9yRWxlbWVudC5zY3JvbGxUbygwLCAwKTtcclxuICAgICAgICB0aGlzLmlzU2hvd01vcmUudXBkYXRlKChwcmV2KSA9PiAhcHJldik7XHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSBpbml0RWRpdG9ySWRFZmZlY3QoKTogdm9pZCB7XHJcbiAgICAgICAgZWZmZWN0KCgpID0+IHtcclxuICAgICAgICAgICAgdGhpcy5lZGl0b3JJZCgpO1xyXG4gICAgICAgICAgICB0aGlzLmlzU2hvd01vcmUuc2V0KGZhbHNlKTtcclxuICAgICAgICB9LCB7IGFsbG93U2lnbmFsV3JpdGVzOiB0cnVlIH0pO1xyXG4gICAgfVxyXG59XHJcbiIsIjxjdWktZWRpdG9yXHJcbiAgICBjdWlFbGVtZW50XHJcbiAgICAjZWRpdG9yRWxlbWVudD1cImVsZW1lbnRSZWZcIlxyXG4gICAgI2VkaXRvckNvbXBvbmVudFxyXG4gICAgY2xhc3M9XCJlZGl0b3JcIlxyXG4gICAgW2NsYXNzLmVkaXRvcl9vcGVuZWRdPVwiaXNTaG93TW9yZSgpXCJcclxuICAgIFtlZGl0b3JBcGlJZF09XCJlZGl0b3JJZCgpXCJcclxuICAgIFtjb25maWddPVwiZWRpdG9yQ29uZmlnKClcIlxyXG4vPlxyXG5cclxuPG5nLXRlbXBsYXRlIFtlZGl0b3JSZXNpemVPYnNlcnZlcl0gW3RhcmdldF09XCJlZGl0b3JFbGVtZW50Lm5hdGl2ZUVsZW1lbnRcIiBbc2hvcnRIZWlnaHRdPVwic2hvcnRIZWlnaHQoKVwiPlxyXG4gICAgPGJ1dHRvbiBjbGFzcz1cImMtYnV0dG9uXCIgKGNsaWNrKT1cIm9uU2hvdyhlZGl0b3JDb21wb25lbnQpXCI+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJidXR0b25UZW1wbGF0ZSgpXCIgW25nVGVtcGxhdGVPdXRsZXRDb250ZXh0XT1cInsgJGltcGxpY2l0OiBpc1Nob3dNb3JlIH1cIj48L25nLWNvbnRhaW5lcj5cclxuICAgIDwvYnV0dG9uPlxyXG48L25nLXRlbXBsYXRlPlxyXG4iXX0=
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { Directive, effect, inject, input, TemplateRef, ViewContainerRef } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class EditorResizeObserverDirective {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.templateRef = inject(TemplateRef);
|
|
6
|
+
this.viewContainerRef = inject(ViewContainerRef);
|
|
7
|
+
this.observer = null;
|
|
8
|
+
this.target = input.required();
|
|
9
|
+
this.shortHeight = input.required();
|
|
10
|
+
this.initTargetEffect();
|
|
11
|
+
}
|
|
12
|
+
ngOnDestroy() {
|
|
13
|
+
this.destroyObserver();
|
|
14
|
+
}
|
|
15
|
+
initTargetEffect() {
|
|
16
|
+
effect(() => {
|
|
17
|
+
const target = this.target();
|
|
18
|
+
if (!target) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
this.initObserver();
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
initObserver() {
|
|
25
|
+
this.observer = new ResizeObserver((entries) => {
|
|
26
|
+
if (entries[0].target.scrollHeight <= this.shortHeight()) {
|
|
27
|
+
this.viewContainerRef.clear();
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
if (this.viewContainerRef.length) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
this.viewContainerRef.createEmbeddedView(this.templateRef);
|
|
34
|
+
});
|
|
35
|
+
this.observer.observe(this.target());
|
|
36
|
+
}
|
|
37
|
+
destroyObserver() {
|
|
38
|
+
this.observer?.disconnect();
|
|
39
|
+
this.observer = null;
|
|
40
|
+
}
|
|
41
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EditorResizeObserverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
42
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: EditorResizeObserverDirective, isStandalone: true, selector: "[editorResizeObserver]", inputs: { target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: true, transformFunction: null }, shortHeight: { classPropertyName: "shortHeight", publicName: "shortHeight", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
|
|
43
|
+
}
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EditorResizeObserverDirective, decorators: [{
|
|
45
|
+
type: Directive,
|
|
46
|
+
args: [{
|
|
47
|
+
selector: '[editorResizeObserver]',
|
|
48
|
+
standalone: true
|
|
49
|
+
}]
|
|
50
|
+
}], ctorParameters: () => [] });
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLXJlc2l6ZS1vYnNlcnZlci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2VkaXRvci93aWRnZXRzL2VkaXRvci1yZWFkb25seS9lZGl0b3ItcmVzaXplLW9ic2VydmVyLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFNaEcsTUFBTSxPQUFPLDZCQUE2QjtJQVN0QztRQVJpQixnQkFBVyxHQUFHLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUNsQyxxQkFBZ0IsR0FBRyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUVyRCxhQUFRLEdBQTBCLElBQUksQ0FBQztRQUUvQixXQUFNLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBZSxDQUFDO1FBQ3ZDLGdCQUFXLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBVSxDQUFDO1FBR25ELElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQzVCLENBQUM7SUFFTSxXQUFXO1FBQ2QsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQzNCLENBQUM7SUFFTyxnQkFBZ0I7UUFDcEIsTUFBTSxDQUFDLEdBQUcsRUFBRTtZQUNSLE1BQU0sTUFBTSxHQUFHLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztZQUU3QixJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7Z0JBQ1YsT0FBTztZQUNYLENBQUM7WUFFRCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDeEIsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDO0lBRU8sWUFBWTtRQUNoQixJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksY0FBYyxDQUFDLENBQUMsT0FBTyxFQUFFLEVBQUU7WUFDM0MsSUFBSSxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLFlBQVksSUFBSSxJQUFJLENBQUMsV0FBVyxFQUFFLEVBQUUsQ0FBQztnQkFDdkQsSUFBSSxDQUFDLGdCQUFnQixDQUFDLEtBQUssRUFBRSxDQUFDO2dCQUU5QixPQUFPO1lBQ1gsQ0FBQztZQUVELElBQUksSUFBSSxDQUFDLGdCQUFnQixDQUFDLE1BQU0sRUFBRSxDQUFDO2dCQUMvQixPQUFPO1lBQ1gsQ0FBQztZQUVELElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDL0QsQ0FBQyxDQUFDLENBQUM7UUFFSCxJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsQ0FBQztJQUN6QyxDQUFDO0lBRU8sZUFBZTtRQUNuQixJQUFJLENBQUMsUUFBUSxFQUFFLFVBQVUsRUFBRSxDQUFDO1FBQzVCLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDO0lBQ3pCLENBQUM7K0dBbERRLDZCQUE2QjttR0FBN0IsNkJBQTZCOzs0RkFBN0IsNkJBQTZCO2tCQUp6QyxTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSx3QkFBd0I7b0JBQ2xDLFVBQVUsRUFBRSxJQUFJO2lCQUNuQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgZWZmZWN0LCBpbmplY3QsIGlucHV0LCBUZW1wbGF0ZVJlZiwgVmlld0NvbnRhaW5lclJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ1tlZGl0b3JSZXNpemVPYnNlcnZlcl0nLFxuICAgIHN0YW5kYWxvbmU6IHRydWVcbn0pXG5leHBvcnQgY2xhc3MgRWRpdG9yUmVzaXplT2JzZXJ2ZXJEaXJlY3RpdmUge1xuICAgIHByaXZhdGUgcmVhZG9ubHkgdGVtcGxhdGVSZWYgPSBpbmplY3QoVGVtcGxhdGVSZWYpO1xuICAgIHByaXZhdGUgcmVhZG9ubHkgdmlld0NvbnRhaW5lclJlZiA9IGluamVjdChWaWV3Q29udGFpbmVyUmVmKTtcblxuICAgIHByaXZhdGUgb2JzZXJ2ZXI6IFJlc2l6ZU9ic2VydmVyIHwgbnVsbCA9IG51bGw7XG5cbiAgICBwdWJsaWMgcmVhZG9ubHkgdGFyZ2V0ID0gaW5wdXQucmVxdWlyZWQ8SFRNTEVsZW1lbnQ+KCk7XG4gICAgcHVibGljIHJlYWRvbmx5IHNob3J0SGVpZ2h0ID0gaW5wdXQucmVxdWlyZWQ8bnVtYmVyPigpO1xuXG4gICAgY29uc3RydWN0b3IoKSB7XG4gICAgICAgIHRoaXMuaW5pdFRhcmdldEVmZmVjdCgpO1xuICAgIH1cblxuICAgIHB1YmxpYyBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5kZXN0cm95T2JzZXJ2ZXIoKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIGluaXRUYXJnZXRFZmZlY3QoKTogdm9pZCB7XG4gICAgICAgIGVmZmVjdCgoKSA9PiB7XG4gICAgICAgICAgICBjb25zdCB0YXJnZXQgPSB0aGlzLnRhcmdldCgpO1xuXG4gICAgICAgICAgICBpZiAoIXRhcmdldCkge1xuICAgICAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgdGhpcy5pbml0T2JzZXJ2ZXIoKTtcbiAgICAgICAgfSk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBpbml0T2JzZXJ2ZXIoKTogdm9pZCB7XG4gICAgICAgIHRoaXMub2JzZXJ2ZXIgPSBuZXcgUmVzaXplT2JzZXJ2ZXIoKGVudHJpZXMpID0+IHtcbiAgICAgICAgICAgIGlmIChlbnRyaWVzWzBdLnRhcmdldC5zY3JvbGxIZWlnaHQgPD0gdGhpcy5zaG9ydEhlaWdodCgpKSB7XG4gICAgICAgICAgICAgICAgdGhpcy52aWV3Q29udGFpbmVyUmVmLmNsZWFyKCk7XG5cbiAgICAgICAgICAgICAgICByZXR1cm47XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIGlmICh0aGlzLnZpZXdDb250YWluZXJSZWYubGVuZ3RoKSB7XG4gICAgICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICB0aGlzLnZpZXdDb250YWluZXJSZWYuY3JlYXRlRW1iZWRkZWRWaWV3KHRoaXMudGVtcGxhdGVSZWYpO1xuICAgICAgICB9KTtcblxuICAgICAgICB0aGlzLm9ic2VydmVyLm9ic2VydmUodGhpcy50YXJnZXQoKSk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBkZXN0cm95T2JzZXJ2ZXIoKTogdm9pZCB7XG4gICAgICAgIHRoaXMub2JzZXJ2ZXI/LmRpc2Nvbm5lY3QoKTtcbiAgICAgICAgdGhpcy5vYnNlcnZlciA9IG51bGw7XG4gICAgfVxufVxuIl19
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, ChangeDetectionStrategy, inject, Renderer2, input, model, effect, Directive, InjectionToken, Input, HostBinding, ChangeDetectorRef, ViewChild, EventEmitter, Output, NgModule, Injector, Injectable, SkipSelf, Optional, DestroyRef, NgZone, signal, TemplateRef, ContentChildren, ElementRef, HostListener, Self, INJECTOR, forwardRef, ViewContainerRef, booleanAttribute, computed, untracked, Pipe, APP_INITIALIZER, viewChild,
|
|
2
|
+
import { Component, ChangeDetectionStrategy, inject, Renderer2, input, model, effect, Directive, InjectionToken, Input, HostBinding, ChangeDetectorRef, ViewChild, EventEmitter, Output, NgModule, Injector, Injectable, SkipSelf, Optional, DestroyRef, NgZone, signal, TemplateRef, ContentChildren, ElementRef, HostListener, Self, INJECTOR, forwardRef, ViewContainerRef, booleanAttribute, computed, untracked, Pipe, APP_INITIALIZER, viewChild, output, makeEnvironmentProviders } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule, DOCUMENT, NgForOf, NgIf, NgComponentOutlet, NgTemplateOutlet, NgFor, UpperCasePipe, NgClass, Location } from '@angular/common';
|
|
5
5
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
@@ -7474,28 +7474,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
7474
7474
|
type: Input
|
|
7475
7475
|
}] } });
|
|
7476
7476
|
|
|
7477
|
+
class EditorResizeObserverDirective {
|
|
7478
|
+
constructor() {
|
|
7479
|
+
this.templateRef = inject(TemplateRef);
|
|
7480
|
+
this.viewContainerRef = inject(ViewContainerRef);
|
|
7481
|
+
this.observer = null;
|
|
7482
|
+
this.target = input.required();
|
|
7483
|
+
this.shortHeight = input.required();
|
|
7484
|
+
this.initTargetEffect();
|
|
7485
|
+
}
|
|
7486
|
+
ngOnDestroy() {
|
|
7487
|
+
this.destroyObserver();
|
|
7488
|
+
}
|
|
7489
|
+
initTargetEffect() {
|
|
7490
|
+
effect(() => {
|
|
7491
|
+
const target = this.target();
|
|
7492
|
+
if (!target) {
|
|
7493
|
+
return;
|
|
7494
|
+
}
|
|
7495
|
+
this.initObserver();
|
|
7496
|
+
});
|
|
7497
|
+
}
|
|
7498
|
+
initObserver() {
|
|
7499
|
+
this.observer = new ResizeObserver((entries) => {
|
|
7500
|
+
if (entries[0].target.scrollHeight <= this.shortHeight()) {
|
|
7501
|
+
this.viewContainerRef.clear();
|
|
7502
|
+
return;
|
|
7503
|
+
}
|
|
7504
|
+
if (this.viewContainerRef.length) {
|
|
7505
|
+
return;
|
|
7506
|
+
}
|
|
7507
|
+
this.viewContainerRef.createEmbeddedView(this.templateRef);
|
|
7508
|
+
});
|
|
7509
|
+
this.observer.observe(this.target());
|
|
7510
|
+
}
|
|
7511
|
+
destroyObserver() {
|
|
7512
|
+
this.observer?.disconnect();
|
|
7513
|
+
this.observer = null;
|
|
7514
|
+
}
|
|
7515
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EditorResizeObserverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
7516
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.13", type: EditorResizeObserverDirective, isStandalone: true, selector: "[editorResizeObserver]", inputs: { target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: true, transformFunction: null }, shortHeight: { classPropertyName: "shortHeight", publicName: "shortHeight", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
|
|
7517
|
+
}
|
|
7518
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EditorResizeObserverDirective, decorators: [{
|
|
7519
|
+
type: Directive,
|
|
7520
|
+
args: [{
|
|
7521
|
+
selector: '[editorResizeObserver]',
|
|
7522
|
+
standalone: true
|
|
7523
|
+
}]
|
|
7524
|
+
}], ctorParameters: () => [] });
|
|
7525
|
+
|
|
7477
7526
|
class CuiEditorReadonlyComponent {
|
|
7478
7527
|
constructor() {
|
|
7479
7528
|
this.isShowMore = signal(false);
|
|
7480
|
-
this.isMoreButtonShown = signal(false);
|
|
7481
7529
|
this.editorConfig = computed(() => ({ readOnly: true, withoutPreload: true, ...this.config() }));
|
|
7530
|
+
this.DEFAULT_SHORT_HEIGHT = 68;
|
|
7482
7531
|
this.editor = viewChild.required('editor');
|
|
7483
7532
|
this.editorId = input.required();
|
|
7484
7533
|
this.config = input.required();
|
|
7485
7534
|
this.buttonTemplate = input.required();
|
|
7486
|
-
this.shortHeight = input(
|
|
7535
|
+
this.shortHeight = input(this.DEFAULT_SHORT_HEIGHT);
|
|
7487
7536
|
this.initEditorIdEffect();
|
|
7488
|
-
this.initReadEditorProperty();
|
|
7489
7537
|
}
|
|
7490
7538
|
onShow(editor) {
|
|
7491
7539
|
editor.editorElement.scrollTo(0, 0);
|
|
7492
7540
|
this.isShowMore.update((prev) => !prev);
|
|
7493
7541
|
}
|
|
7494
|
-
initReadEditorProperty() {
|
|
7495
|
-
afterRender({
|
|
7496
|
-
read: () => this.isMoreButtonShown.set(this.editor().editorElement?.scrollHeight > this.shortHeight())
|
|
7497
|
-
});
|
|
7498
|
-
}
|
|
7499
7542
|
initEditorIdEffect() {
|
|
7500
7543
|
effect(() => {
|
|
7501
7544
|
this.editorId();
|
|
@@ -7503,11 +7546,11 @@ class CuiEditorReadonlyComponent {
|
|
|
7503
7546
|
}, { allowSignalWrites: true });
|
|
7504
7547
|
}
|
|
7505
7548
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiEditorReadonlyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7506
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
7549
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: CuiEditorReadonlyComponent, isStandalone: true, selector: "cui-editor-readonly", inputs: { editorId: { classPropertyName: "editorId", publicName: "editorId", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, buttonTemplate: { classPropertyName: "buttonTemplate", publicName: "buttonTemplate", isSignal: true, isRequired: true, transformFunction: null }, shortHeight: { classPropertyName: "shortHeight", publicName: "shortHeight", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, isSignal: true }], ngImport: i0, template: "<cui-editor\r\n cuiElement\r\n #editorElement=\"elementRef\"\r\n #editorComponent\r\n class=\"editor\"\r\n [class.editor_opened]=\"isShowMore()\"\r\n [editorApiId]=\"editorId()\"\r\n [config]=\"editorConfig()\"\r\n/>\r\n\r\n<ng-template [editorResizeObserver] [target]=\"editorElement.nativeElement\" [shortHeight]=\"shortHeight()\">\r\n <button class=\"c-button\" (click)=\"onShow(editorComponent)\">\r\n <ng-container [ngTemplateOutlet]=\"buttonTemplate()\" [ngTemplateOutletContext]=\"{ $implicit: isShowMore }\"></ng-container>\r\n </button>\r\n</ng-template>\r\n", styles: [":host{--height: 69px;--fullHeight: 500px;display:flex;flex-direction:column;gap:8px}:host .editor{display:block;max-height:var(--height);overflow:hidden}:host .editor ::ng-deep [data-editor]{overflow:hidden}:host .editor_opened{max-height:var(--fullHeight)}:host .editor_opened ::ng-deep [data-editor]{max-height:var(--fullHeight);overflow:hidden auto}.c-button{padding:0}\n"], dependencies: [{ kind: "component", type: CuiEditorComponent, selector: "cui-editor", inputs: ["editorApiId", "config", "requestSize"], outputs: ["editorEmpty"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EditorResizeObserverDirective, selector: "[editorResizeObserver]", inputs: ["target", "shortHeight"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7507
7550
|
}
|
|
7508
7551
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiEditorReadonlyComponent, decorators: [{
|
|
7509
7552
|
type: Component,
|
|
7510
|
-
args: [{ selector: 'cui-editor-readonly', standalone: true, imports: [CuiEditorComponent, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-editor\r\n #
|
|
7553
|
+
args: [{ selector: 'cui-editor-readonly', standalone: true, imports: [CuiEditorComponent, NgTemplateOutlet, EditorResizeObserverDirective, CuiElementDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-editor\r\n cuiElement\r\n #editorElement=\"elementRef\"\r\n #editorComponent\r\n class=\"editor\"\r\n [class.editor_opened]=\"isShowMore()\"\r\n [editorApiId]=\"editorId()\"\r\n [config]=\"editorConfig()\"\r\n/>\r\n\r\n<ng-template [editorResizeObserver] [target]=\"editorElement.nativeElement\" [shortHeight]=\"shortHeight()\">\r\n <button class=\"c-button\" (click)=\"onShow(editorComponent)\">\r\n <ng-container [ngTemplateOutlet]=\"buttonTemplate()\" [ngTemplateOutletContext]=\"{ $implicit: isShowMore }\"></ng-container>\r\n </button>\r\n</ng-template>\r\n", styles: [":host{--height: 69px;--fullHeight: 500px;display:flex;flex-direction:column;gap:8px}:host .editor{display:block;max-height:var(--height);overflow:hidden}:host .editor ::ng-deep [data-editor]{overflow:hidden}:host .editor_opened{max-height:var(--fullHeight)}:host .editor_opened ::ng-deep [data-editor]{max-height:var(--fullHeight);overflow:hidden auto}.c-button{padding:0}\n"] }]
|
|
7511
7554
|
}], ctorParameters: () => [] });
|
|
7512
7555
|
|
|
7513
7556
|
class CuiEditorModalComponent {
|