@leanix/components 0.4.794 → 0.4.795
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.
|
@@ -948,7 +948,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
948
948
|
* </table>
|
|
949
949
|
* ```
|
|
950
950
|
*/
|
|
951
|
-
// eslint-disable-next-line @angular-eslint/directive-class-suffix
|
|
952
951
|
class TableComponent {
|
|
953
952
|
constructor() {
|
|
954
953
|
/**
|
|
@@ -3096,7 +3095,7 @@ class TokenizerOverflowPopoverComponent {
|
|
|
3096
3095
|
}
|
|
3097
3096
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TokenizerOverflowPopoverComponent, decorators: [{
|
|
3098
3097
|
type: Component,
|
|
3099
|
-
args: [{ selector: 'lx-tokenizer-overflow-popover', imports: [SatPopoverModule, NgTemplateOutlet],
|
|
3098
|
+
args: [{ selector: 'lx-tokenizer-overflow-popover', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SatPopoverModule, NgTemplateOutlet], template: "<sat-popover\n (backdropClicked)=\"closePopover()\"\n [hasBackdrop]=\"true\"\n [horizontalAlign]=\"horizontalAlign()\"\n [verticalAlign]=\"verticalAlign()\"\n openTransition=\"100ms\"\n closeTransition=\"100ms\"\n>\n @if (popoverTemplate) {\n <div\n class=\"tokenizerPopoverContentWrapper\"\n [class.before]=\"horizontalAlign() === 'before'\"\n [class.after]=\"horizontalAlign() === 'after'\"\n >\n <ng-container *ngTemplateOutlet=\"popoverTemplate; context: { $implicit: startIndex() }\" />\n </div>\n }\n</sat-popover>\n", styles: [".tokenizerPopoverContentWrapper{padding:16px;background:#fff;border-radius:4px;box-shadow:0 8px 14px #5261794d}.tokenizerPopoverContentWrapper.before{margin-right:10px}.tokenizerPopoverContentWrapper.after{margin-left:10px}\n"] }]
|
|
3100
3099
|
}], ctorParameters: () => [], propDecorators: { popoverTemplate: [{
|
|
3101
3100
|
type: ContentChild,
|
|
3102
3101
|
args: ['popoverTemplate']
|
|
@@ -3227,7 +3226,7 @@ class TokenizerComponent {
|
|
|
3227
3226
|
}
|
|
3228
3227
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TokenizerComponent, decorators: [{
|
|
3229
3228
|
type: Component,
|
|
3230
|
-
args: [{ selector: 'lx-tokenizer', imports: [CounterComponent, ButtonComponent, TranslateModule],
|
|
3229
|
+
args: [{ selector: 'lx-tokenizer', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CounterComponent, ButtonComponent, TranslateModule], template: "<div #tokensContainer class=\"tokensContainer\">\n <ng-content select=\"lx-token\" />\n @if (showCounter()) {\n <button\n lx-button\n class=\"counterButton\"\n mode=\"ghost\"\n (click)=\"onCounterClicked()\"\n [attr.aria-label]=\"\n NAME + (overflowItemCount() === 1 ? '.showMoreItem' : '.showMoreItems') | translate: { count: overflowItemCount() }\n \"\n >\n <lx-counter #counter aria-hidden=\"true\" [content]=\"'+' + overflowItemCount()\" color=\"gray\" />\n </button>\n }\n</div>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap}:host .counterButton{padding:0;display:flex;align-items:center;margin-left:4px;border-radius:12px}.tokensContainer{display:flex;align-items:center}\n"] }]
|
|
3231
3230
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.DestroyRef }, { type: i0.ChangeDetectorRef }, { type: ResizeObserverService }], propDecorators: { overflowPlaceholderClick: [{
|
|
3232
3231
|
type: Output
|
|
3233
3232
|
}], items: [{
|
|
@@ -3642,7 +3641,7 @@ class BasicDropdownComponent extends KeyboardSelectDirective {
|
|
|
3642
3641
|
}
|
|
3643
3642
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: BasicDropdownComponent, decorators: [{
|
|
3644
3643
|
type: Component,
|
|
3645
|
-
args: [{ selector: 'lx-basic-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }],
|
|
3644
|
+
args: [{ selector: 'lx-basic-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }], imports: [
|
|
3646
3645
|
NgTemplateOutlet,
|
|
3647
3646
|
CdkOverlayOrigin,
|
|
3648
3647
|
CdkConnectedOverlay,
|
|
@@ -3767,8 +3766,8 @@ class KeyboardActionSourceDirective {
|
|
|
3767
3766
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: KeyboardActionSourceDirective, decorators: [{
|
|
3768
3767
|
type: Directive,
|
|
3769
3768
|
args: [{
|
|
3770
|
-
|
|
3771
|
-
|
|
3769
|
+
selector: '[lxKeyboardActionSource]',
|
|
3770
|
+
exportAs: 'keyboardActionSource'
|
|
3772
3771
|
}]
|
|
3773
3772
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
3774
3773
|
|
|
@@ -4547,13 +4546,13 @@ __decorate([
|
|
|
4547
4546
|
], CurrencyInputComponent.prototype, "data$", void 0);
|
|
4548
4547
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CurrencyInputComponent, decorators: [{
|
|
4549
4548
|
type: Component,
|
|
4550
|
-
args: [{ selector: 'lx-currency-input', providers: [
|
|
4549
|
+
args: [{ selector: 'lx-currency-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
4551
4550
|
{
|
|
4552
4551
|
provide: NG_VALUE_ACCESSOR,
|
|
4553
4552
|
useExisting: forwardRef(() => CurrencyInputComponent),
|
|
4554
4553
|
multi: true
|
|
4555
4554
|
}
|
|
4556
|
-
],
|
|
4555
|
+
], imports: [CurrencySymbolComponent, MarkInvalidDirective, FormsModule, AsyncPipe, DecimalPipe], template: "@if (mode === 'edit') {\n <div class=\"container input-group\">\n @if (iconPosition === 'first') {\n <div class=\"labelContainer input-group-addon\">\n <lx-currency-symbol [code]=\"code\" />\n </div>\n }\n @if (!showCurrencyInput) {\n <input\n [attr.disabled]=\"disabled ? true : null\"\n type=\"text\"\n class=\"form-control currencyDisplayValue\"\n placeholder=\"{{ placeholder }}\"\n [lxMarkInvalid]=\"markInvalid\"\n [value]=\"dataValue$ | async | number: format\"\n (focus)=\"focusCurrencyInput()\"\n />\n }\n <input\n autocomplete=\"off\"\n [attr.disabled]=\"disabled ? true : null\"\n [class.hideInput]=\"!showCurrencyInput\"\n type=\"text\"\n inputmode=\"numeric\"\n class=\"form-control currencyInput\"\n name=\"inputAmount\"\n [attr.id]=\"inputId\"\n #currencyInput\n placeholder=\"{{ placeholder }}\"\n [ngModel]=\"dataValue$ | async\"\n (blur)=\"onBlur()\"\n (ngModelChange)=\"valueChanged($event)\"\n />\n @if (iconPosition === 'end') {\n <div class=\"labelContainer input-group-addon\">\n <lx-currency-symbol [code]=\"code\" />\n </div>\n }\n </div>\n} @else if (mode === 'view') {\n <span [class.placeholder]=\"(dataValue$ | async) === null && placeholder\">\n <!-- Not using Angular 2 currency pipe since a lot of currency symbols are missing: https://github.com/angular/angular/issues/6724 -->\n @if (iconPosition === 'first') {\n <lx-currency-symbol [code]=\"code\" />\n }\n {{ (dataValue$ | async | number: format) || placeholder }}\n @if (iconPosition === 'end') {\n <lx-currency-symbol [code]=\"code\" />\n }\n </span>\n}\n", styles: [".container{width:100%!important;padding:0}.labelContainer{width:5%!important;min-width:40px}input{width:100%}input.hideInput{display:none}.placeholder{color:#99a5bb}\n"] }]
|
|
4557
4556
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { code: [{
|
|
4558
4557
|
type: Input
|
|
4559
4558
|
}], decimalSeparator: [{
|
|
@@ -6883,7 +6882,7 @@ class MultiSelectSelectionComponent extends KeyboardSelectDirective {
|
|
|
6883
6882
|
}
|
|
6884
6883
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: MultiSelectSelectionComponent, decorators: [{
|
|
6885
6884
|
type: Component,
|
|
6886
|
-
args: [{ selector: 'lx-multi-select-selection', imports: [AsyncPipe, NgTemplateOutlet, SelectableItemDirective, TokenizerComponent, TokenComponent],
|
|
6885
|
+
args: [{ selector: 'lx-multi-select-selection', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AsyncPipe, NgTemplateOutlet, SelectableItemDirective, TokenizerComponent, TokenComponent], template: "<ul>\n <lx-tokenizer [active]=\"tokenize()\">\n @for (selectedItem of selection(); track $index) {\n <lx-token>\n <li\n lxSelectableItem\n #item\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n (select)=\"removeItem.emit(selectedItem)\"\n >\n <ng-container *ngTemplateOutlet=\"selectionTemplate; context: { $implicit: selectedItem }\" />\n </li>\n </lx-token>\n }\n </lx-tokenizer>\n</ul>\n", styles: [":host{display:block;overflow:hidden;overflow-x:auto;scrollbar-width:none}ul{display:block;margin:0!important;padding:0!important}li{display:inline}\n"] }]
|
|
6887
6886
|
}], propDecorators: { removeItem: [{
|
|
6888
6887
|
type: Output
|
|
6889
6888
|
}], selectionTemplate: [{
|
|
@@ -7260,7 +7259,7 @@ class OptionGroupDropdownComponent extends KeyboardSelectDirective {
|
|
|
7260
7259
|
}
|
|
7261
7260
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: OptionGroupDropdownComponent, decorators: [{
|
|
7262
7261
|
type: Component,
|
|
7263
|
-
args: [{ selector: 'lx-option-group-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }],
|
|
7262
|
+
args: [{ selector: 'lx-option-group-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }], imports: [
|
|
7264
7263
|
CdkOverlayOrigin,
|
|
7265
7264
|
CdkConnectedOverlay,
|
|
7266
7265
|
NgClass,
|
|
@@ -8026,13 +8025,13 @@ class PickerComponent {
|
|
|
8026
8025
|
}
|
|
8027
8026
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PickerComponent, decorators: [{
|
|
8028
8027
|
type: Component,
|
|
8029
|
-
args: [{ selector: 'lx-picker', providers: [
|
|
8028
|
+
args: [{ selector: 'lx-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
8030
8029
|
{
|
|
8031
8030
|
provide: NG_VALUE_ACCESSOR,
|
|
8032
8031
|
multi: true,
|
|
8033
8032
|
useExisting: forwardRef(() => PickerComponent)
|
|
8034
8033
|
}
|
|
8035
|
-
],
|
|
8034
|
+
], imports: [AutocloseDirective], template: "<div class=\"pickerContainer\">\n <ng-content select=\"[lxPickerTrigger]\" />\n @if (open) {\n <ul\n class=\"pickerOptions\"\n lxAutoclose\n (autoclose)=\"closePicker()\"\n role=\"listbox\"\n [style.margin-left]=\"leftOffset\"\n [attr.aria-activedescendant]=\"activeDescendantsId\"\n [attr.aria-label]=\"listBoxAriaLabel\"\n [attr.aria-labelledby]=\"listBoxAriaLabelledBy\"\n >\n <ng-content />\n </ul>\n }\n</div>\n", styles: [":host{display:inline-block;width:100%;position:relative}.pickerOptions{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;padding:4px;z-index:20;width:185px}\n"] }]
|
|
8036
8035
|
}], ctorParameters: () => [{ type: i1$6.Directionality }, { type: i0.ChangeDetectorRef }], propDecorators: { listBoxAriaLabel: [{
|
|
8037
8036
|
type: Input
|
|
8038
8037
|
}], listBoxAriaLabelledBy: [{
|
|
@@ -9649,7 +9648,7 @@ class TableBubbleMenuComponent {
|
|
|
9649
9648
|
}
|
|
9650
9649
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TableBubbleMenuComponent, decorators: [{
|
|
9651
9650
|
type: Component,
|
|
9652
|
-
args: [{ selector: 'lx-table-bubble-menu', imports: [TranslatePipe],
|
|
9651
|
+
args: [{ selector: 'lx-table-bubble-menu', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslatePipe], template: "<div #bubbleMenuRow class=\"bubble-menu-row\">\n <button (click)=\"editor.chain().focus().addRowBefore().run()\">{{ NAME + '.addRowBefore' | translate }}</button>\n <button (click)=\"editor.chain().focus().addRowAfter().run()\">{{ NAME + '.addRowAfter' | translate }}</button>\n <button (click)=\"editor.chain().focus().deleteRow().run()\">{{ NAME + '.deleteRow' | translate }}</button>\n</div>\n\n<div #bubbleMenuColumn class=\"bubble-menu-column\">\n <button (click)=\"editor.chain().focus().addColumnBefore().run()\">{{ NAME + '.addColumnBefore' | translate }}</button>\n <button (click)=\"editor.chain().focus().addColumnAfter().run()\">{{ NAME + '.addColumnAfter' | translate }}</button>\n <button (click)=\"editor.chain().focus().deleteColumn().run()\">{{ NAME + '.deleteColumn' | translate }}</button>\n</div>\n\n<div #bubbleMenuTable class=\"bubble-menu-table\">\n <button (click)=\"editor.chain().focus().addRowAfter().run()\">{{ NAME + '.addRow' | translate }}</button>\n <button (click)=\"editor.chain().focus().addColumnAfter().run()\">{{ NAME + '.addColumn' | translate }}</button>\n <button (click)=\"editor.chain().focus().deleteTable().run()\">{{ NAME + '.deleteTable' | translate }}</button>\n</div>\n", styles: [".bubble-menu-column,.bubble-menu-row,.bubble-menu-table{display:flex;flex-direction:column;background:#fff;border:1px solid #e1e5eb;border-radius:3px;z-index:10;box-shadow:0 8px 12px 2px #00000026;min-width:160px}.bubble-menu-column button,.bubble-menu-row button,.bubble-menu-table button{background:none;border:none;padding:8px;text-align:left;width:100%;font-size:var(--lxFontSize);color:#2a303d;cursor:pointer;border-radius:3px;transition:background-color .2s}.bubble-menu-column button:hover,.bubble-menu-row button:hover,.bubble-menu-table button:hover{background-color:#e1e5eb}\n"] }]
|
|
9653
9652
|
}], propDecorators: { editor: [{
|
|
9654
9653
|
type: Input,
|
|
9655
9654
|
args: [{ required: true }]
|
|
@@ -10539,7 +10538,7 @@ class LinkModalComponent {
|
|
|
10539
10538
|
}
|
|
10540
10539
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LinkModalComponent, decorators: [{
|
|
10541
10540
|
type: Component,
|
|
10542
|
-
args: [{ selector: 'lx-link-modal', imports: [
|
|
10541
|
+
args: [{ selector: 'lx-link-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
10543
10542
|
ModalComponent,
|
|
10544
10543
|
ModalHeaderComponent,
|
|
10545
10544
|
ModalFooterComponent,
|
|
@@ -10550,7 +10549,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
10550
10549
|
ErrorMessageComponent,
|
|
10551
10550
|
MarkInvalidDirective,
|
|
10552
10551
|
AutofocusDirective
|
|
10553
|
-
],
|
|
10552
|
+
], template: "<lx-modal size=\"dialog\" [open]=\"true\" (close)=\"closeModal()\">\n <lx-modal-header [title]=\"NAME + '.link' | translate\" />\n\n <form #form=\"ngForm\" (submit)=\"saveLink()\">\n <div class=\"link-modal-body\">\n <div class=\"form-group required\">\n <label for=\"text\">{{ NAME + '.linkText' | translate }}</label>\n <input\n #titleInput=\"ngModel\"\n class=\"form-control\"\n name=\"text\"\n type=\"text\"\n [ngModel]=\"text\"\n [lxAutofocus]=\"true\"\n [lxAutofocusTimeout]=\"10\"\n [lxMarkInvalid]=\"form.submitted && titleInput.control.touched && titleInput.hasError('required')\"\n required\n />\n </div>\n\n <div class=\"form-group required\">\n <label for=\"url\">{{ NAME + '.url' | translate }}</label>\n <input\n #urlInput=\"ngModel\"\n class=\"form-control\"\n name=\"url\"\n type=\"text\"\n [ngModel]=\"url\"\n [lxMarkInvalid]=\"form.submitted && urlInput.control.touched && urlInput.hasError('invalidUrl')\"\n lxUrl\n />\n @if (form.submitted && urlInput.control.touched && urlInput.hasError('invalidUrl')) {\n <lx-error-message>\n {{ NAME + '.invalidUrl' | translate }}\n </lx-error-message>\n }\n </div>\n </div>\n\n <lx-modal-footer>\n <div class=\"link-modal-actions\">\n <div class=\"link-modal-left-buttons\">\n @if (url) {\n <button lx-button type=\"button\" size=\"large\" color=\"danger\" (click)=\"removeLink()\">\n {{ NAME + '.removeLink' | translate }}\n </button>\n }\n </div>\n\n <div class=\"link-modal-right-buttons\">\n <button lx-button type=\"button\" size=\"large\" (click)=\"closeModal()\">\n {{ NAME + '.cancel' | translate }}\n </button>\n <button lx-button type=\"submit\" [disabled]=\"!titleInput.control.value || !urlInput.control.value\" color=\"primary\" size=\"large\">\n {{ NAME + '.ok' | translate }}\n </button>\n </div>\n </div>\n </lx-modal-footer>\n </form>\n</lx-modal>\n", styles: [".link-modal-body{display:flex;flex-direction:column;padding:20px 64px}.link-modal-actions{display:flex;justify-content:space-between}.link-modal-right-buttons{display:flex;gap:10px}\n"] }]
|
|
10554
10553
|
}], propDecorators: { editor: [{
|
|
10555
10554
|
type: Input,
|
|
10556
10555
|
args: [{ required: true }]
|
|
@@ -10599,7 +10598,7 @@ class RichTextEditorToolbarComponent {
|
|
|
10599
10598
|
}
|
|
10600
10599
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: RichTextEditorToolbarComponent, decorators: [{
|
|
10601
10600
|
type: Component,
|
|
10602
|
-
args: [{ selector: 'lx-rich-text-editor-toolbar', imports: [
|
|
10601
|
+
args: [{ selector: 'lx-rich-text-editor-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
10603
10602
|
OptionsDropdownComponent,
|
|
10604
10603
|
ButtonComponent,
|
|
10605
10604
|
KeyboardActionSourceDirective,
|
|
@@ -10608,7 +10607,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
10608
10607
|
TranslatePipe,
|
|
10609
10608
|
LinkModalComponent,
|
|
10610
10609
|
TooltipDirective
|
|
10611
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"toolbar\" [class.toolbarHidden]=\"!isToolbarVisible()\">\n <div class=\"toolbarItemGroup\">\n @if ('heading' | lxExtensionEnabled: editor) {\n <lx-options-dropdown>\n <button\n class=\"toolbarItem toolbar-heading\"\n lxKeyboardActionSource\n lx-button\n [lxTooltip]=\"NAME + '.textStyles' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [square]=\"false\"\n [pressed]=\"editor.isActive('heading') || editor.isActive('paragraph')\"\n endIcon=\"fa-angle-down\"\n [disabled]=\"!editor.isActive('heading') && !editor.isActive('paragraph')\"\n >\n {{\n editor.isActive('heading')\n ? `${(NAME + '.heading' | translate)} ${editor.getAttributes('heading')['level']}`\n : `${(NAME + '.paragraph' | translate)}`\n }}\n </button>\n\n @for (level of headingLevels; track headingLevels) {\n <lx-option\n (select)=\"editor.chain().setHeading({ level }).focus().run()\"\n [hasSelectedState]=\"editor.isActive('heading', { level })\"\n [selected]=\"editor.isActive('heading', { level })\"\n >\n @if (!editor.isActive('heading', { level })) {\n <i class=\"far fa-heading dropdown-icon\"></i>\n }\n <span>{{ NAME + '.headingOption' | translate }} {{ level }}</span>\n </lx-option>\n }\n\n <lx-option\n (select)=\"this.editor.chain().setParagraph().focus().run()\"\n [hasSelectedState]=\"editor.isActive('paragraph')\"\n [selected]=\"editor.isActive('paragraph')\"\n >\n @if (!editor.isActive('paragraph')) {\n <i class=\"far fa-paragraph dropdown-icon\"></i>\n }\n <span>{{ NAME + '.paragraphOption' | translate }}</span>\n </lx-option>\n </lx-options-dropdown>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('bold' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.bold' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.bold' | translate\"\n [disabled]=\"editor.isActive('header')\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleBold().focus().run()\"\n [pressed]=\"editor.isActive('bold')\"\n icon=\"fa-bold\"\n ></button>\n }\n\n @if ('italic' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.italic' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.italic' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleItalic().focus().run()\"\n [pressed]=\"editor.isActive('italic')\"\n icon=\"fa-italic\"\n ></button>\n }\n\n @if ('underline' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.underline' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.underline' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleUnderline().focus().run()\"\n [pressed]=\"editor.isActive('underline')\"\n icon=\"fa-underline\"\n ></button>\n }\n\n @if ('strike' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.strikethrough' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.strikethrough' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleStrike().focus().run()\"\n [pressed]=\"editor.isActive('strike')\"\n icon=\"fa-strikethrough\"\n ></button>\n }\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('bulletList' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.bulletList' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.bulletList' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleBulletList().run()\"\n [pressed]=\"editor.isActive('listItem')\"\n icon=\"fa-list\"\n ></button>\n }\n\n @if ('orderedList' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.numberedList' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.numberedList' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleOrderedList().run()\"\n [pressed]=\"editor.isActive('orderedList')\"\n icon=\"fa-list-ol\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('textAlign' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignLeft' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignLeft' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('left').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'left' })\"\n icon=\"fa-align-left\"\n ></button>\n\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignCenter' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignCenter' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('center').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'center' })\"\n icon=\"fa-align-center\"\n ></button>\n\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignRight' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignRight' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('right').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'right' })\"\n icon=\"fa-align-right\"\n ></button>\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignBlock' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignBlock' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('justify').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'justify' })\"\n icon=\"fa-align-justify\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('link' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.link' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.link' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().openLinkModal().run()\"\n [pressed]=\"editor.isActive('link')\"\n icon=\"fa-link\"\n ></button>\n <span class=\"separator\"></span>\n }\n </div>\n\n @let tableEnabled = 'table' | lxExtensionEnabled: editor;\n @let codeEnabled = 'codeBlock' | lxExtensionEnabled: editor;\n\n @if (tableEnabled || codeEnabled) {\n <div class=\"toolbarItemGroup\">\n @if (codeEnabled) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.code' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.code' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().setCodeBlock().run()\"\n [pressed]=\"editor.isActive('codeBlock')\"\n icon=\"fa-code\"\n ></button>\n }\n\n @if ('lxDiagram' | lxExtensionEnabled: editor) {\n <ng-content select=\".diagram-btn\" />\n }\n\n @if (tableEnabled) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.insertTable' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.insertTable' | translate\"\n [square]=\"true\"\n (click)=\"insertTable()\"\n [pressed]=\"editor.isActive('table')\"\n icon=\"fa-table\"\n [disabled]=\"editor.isActive('table')\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n }\n</div>\n\n@if (('link' | lxExtensionEnabled: editor) && isLinkModalOpenSignal()) {\n <lx-link-modal [editor]=\"editor\" />\n}\n", styles: [":host{width:100%;display:flex}.toolbar{display:flex;flex-wrap:wrap;width:100%;border-bottom:#99a5bb 1px solid;transition:all .18s ease-out;opacity:1;height:auto;padding:8px}.toolbar.toolbarHidden{opacity:0;height:0!important;padding:0}.toolbar .toolbarItemGroup{display:flex;align-items:center;gap:2px}.toolbar .toolbarItemGroup:not(.toolbarItemGroup:has(.toolbarItem)){display:none}.toolbar .toolbarItemGroup:last-child .separator{display:none}.toolbar .dropdown-icon{margin-left:-4px;margin-right:8px}.toolbar .toolbar-heading{width:100px}.toolbar .toolbarItem{text-wrap:nowrap;color:#2a303d;border:none;height:24px}.toolbar .toolbarItem:hover:not(disabled){border:none}.toolbar .toolbarItem.pressed{background:#f0f2f5!important}.toolbar .toolbarItem.square{border:none!important}.toolbar .separator{width:1px;height:16px;margin:0 4px 0 2px;border:#c2c9d6 .5px solid}\n"] }]
|
|
10610
|
+
], template: "<div class=\"toolbar\" [class.toolbarHidden]=\"!isToolbarVisible()\">\n <div class=\"toolbarItemGroup\">\n @if ('heading' | lxExtensionEnabled: editor) {\n <lx-options-dropdown>\n <button\n class=\"toolbarItem toolbar-heading\"\n lxKeyboardActionSource\n lx-button\n [lxTooltip]=\"NAME + '.textStyles' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [square]=\"false\"\n [pressed]=\"editor.isActive('heading') || editor.isActive('paragraph')\"\n endIcon=\"fa-angle-down\"\n [disabled]=\"!editor.isActive('heading') && !editor.isActive('paragraph')\"\n >\n {{\n editor.isActive('heading')\n ? `${(NAME + '.heading' | translate)} ${editor.getAttributes('heading')['level']}`\n : `${(NAME + '.paragraph' | translate)}`\n }}\n </button>\n\n @for (level of headingLevels; track headingLevels) {\n <lx-option\n (select)=\"editor.chain().setHeading({ level }).focus().run()\"\n [hasSelectedState]=\"editor.isActive('heading', { level })\"\n [selected]=\"editor.isActive('heading', { level })\"\n >\n @if (!editor.isActive('heading', { level })) {\n <i class=\"far fa-heading dropdown-icon\"></i>\n }\n <span>{{ NAME + '.headingOption' | translate }} {{ level }}</span>\n </lx-option>\n }\n\n <lx-option\n (select)=\"this.editor.chain().setParagraph().focus().run()\"\n [hasSelectedState]=\"editor.isActive('paragraph')\"\n [selected]=\"editor.isActive('paragraph')\"\n >\n @if (!editor.isActive('paragraph')) {\n <i class=\"far fa-paragraph dropdown-icon\"></i>\n }\n <span>{{ NAME + '.paragraphOption' | translate }}</span>\n </lx-option>\n </lx-options-dropdown>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('bold' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.bold' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.bold' | translate\"\n [disabled]=\"editor.isActive('header')\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleBold().focus().run()\"\n [pressed]=\"editor.isActive('bold')\"\n icon=\"fa-bold\"\n ></button>\n }\n\n @if ('italic' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.italic' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.italic' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleItalic().focus().run()\"\n [pressed]=\"editor.isActive('italic')\"\n icon=\"fa-italic\"\n ></button>\n }\n\n @if ('underline' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.underline' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.underline' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleUnderline().focus().run()\"\n [pressed]=\"editor.isActive('underline')\"\n icon=\"fa-underline\"\n ></button>\n }\n\n @if ('strike' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.strikethrough' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.strikethrough' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleStrike().focus().run()\"\n [pressed]=\"editor.isActive('strike')\"\n icon=\"fa-strikethrough\"\n ></button>\n }\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('bulletList' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.bulletList' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.bulletList' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleBulletList().run()\"\n [pressed]=\"editor.isActive('listItem')\"\n icon=\"fa-list\"\n ></button>\n }\n\n @if ('orderedList' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.numberedList' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.numberedList' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().toggleOrderedList().run()\"\n [pressed]=\"editor.isActive('orderedList')\"\n icon=\"fa-list-ol\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('textAlign' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignLeft' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignLeft' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('left').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'left' })\"\n icon=\"fa-align-left\"\n ></button>\n\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignCenter' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignCenter' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('center').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'center' })\"\n icon=\"fa-align-center\"\n ></button>\n\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignRight' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignRight' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('right').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'right' })\"\n icon=\"fa-align-right\"\n ></button>\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.alignBlock' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.alignBlock' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().focus().setTextAlign('justify').run()\"\n [pressed]=\"editor.isActive({ textAlign: 'justify' })\"\n icon=\"fa-align-justify\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n\n <div class=\"toolbarItemGroup\">\n @if ('link' | lxExtensionEnabled: editor) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.link' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.link' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().openLinkModal().run()\"\n [pressed]=\"editor.isActive('link')\"\n icon=\"fa-link\"\n ></button>\n <span class=\"separator\"></span>\n }\n </div>\n\n @let tableEnabled = 'table' | lxExtensionEnabled: editor;\n @let codeEnabled = 'codeBlock' | lxExtensionEnabled: editor;\n\n @if (tableEnabled || codeEnabled) {\n <div class=\"toolbarItemGroup\">\n @if (codeEnabled) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.code' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.code' | translate\"\n [square]=\"true\"\n (click)=\"editor.chain().setCodeBlock().run()\"\n [pressed]=\"editor.isActive('codeBlock')\"\n icon=\"fa-code\"\n ></button>\n }\n\n @if ('lxDiagram' | lxExtensionEnabled: editor) {\n <ng-content select=\".diagram-btn\" />\n }\n\n @if (tableEnabled) {\n <button\n class=\"toolbarItem\"\n lx-button\n [attr.aria-label]=\"NAME + '.insertTable' | translate\"\n [mode]=\"'outline'\"\n [size]=\"'medium'\"\n [lxTooltip]=\"NAME + '.insertTable' | translate\"\n [square]=\"true\"\n (click)=\"insertTable()\"\n [pressed]=\"editor.isActive('table')\"\n icon=\"fa-table\"\n [disabled]=\"editor.isActive('table')\"\n ></button>\n }\n\n <span class=\"separator\"></span>\n </div>\n }\n</div>\n\n@if (('link' | lxExtensionEnabled: editor) && isLinkModalOpenSignal()) {\n <lx-link-modal [editor]=\"editor\" />\n}\n", styles: [":host{width:100%;display:flex}.toolbar{display:flex;flex-wrap:wrap;width:100%;border-bottom:#99a5bb 1px solid;transition:all .18s ease-out;opacity:1;height:auto;padding:8px}.toolbar.toolbarHidden{opacity:0;height:0!important;padding:0}.toolbar .toolbarItemGroup{display:flex;align-items:center;gap:2px}.toolbar .toolbarItemGroup:not(.toolbarItemGroup:has(.toolbarItem)){display:none}.toolbar .toolbarItemGroup:last-child .separator{display:none}.toolbar .dropdown-icon{margin-left:-4px;margin-right:8px}.toolbar .toolbar-heading{width:100px}.toolbar .toolbarItem{text-wrap:nowrap;color:#2a303d;border:none;height:24px}.toolbar .toolbarItem:hover:not(disabled){border:none}.toolbar .toolbarItem.pressed{background:#f0f2f5!important}.toolbar .toolbarItem.square{border:none!important}.toolbar .separator{width:1px;height:16px;margin:0 4px 0 2px;border:#c2c9d6 .5px solid}\n"] }]
|
|
10612
10611
|
}], propDecorators: { editor: [{
|
|
10613
10612
|
type: Input,
|
|
10614
10613
|
args: [{ required: true }]
|
|
@@ -10681,14 +10680,11 @@ class RichTextEditorComponent {
|
|
|
10681
10680
|
}
|
|
10682
10681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: RichTextEditorComponent, decorators: [{
|
|
10683
10682
|
type: Component,
|
|
10684
|
-
args: [{ selector: 'lx-rich-text-editor', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
10685
|
-
|
|
10686
|
-
|
|
10687
|
-
|
|
10688
|
-
|
|
10689
|
-
ExtensionEnabledPipe,
|
|
10690
|
-
TruncateButtonComponent
|
|
10691
|
-
], hostDirectives: [
|
|
10683
|
+
args: [{ selector: 'lx-rich-text-editor', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
10684
|
+
'[style.--editor-max-height]': 'maxHeight()',
|
|
10685
|
+
'(focusin)': 'onFocusIn()',
|
|
10686
|
+
'(focusout)': 'onFocusOut($event)'
|
|
10687
|
+
}, hostDirectives: [
|
|
10692
10688
|
{
|
|
10693
10689
|
directive: TipTapEditorDirective,
|
|
10694
10690
|
inputs: ['outputFormat', 'additionalFeatures', 'ariaLabelledBy', 'customExtensions', 'mode']
|
|
@@ -10704,11 +10700,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
10704
10700
|
useExisting: forwardRef(() => RichTextEditorComponent),
|
|
10705
10701
|
multi: true
|
|
10706
10702
|
}
|
|
10707
|
-
],
|
|
10708
|
-
|
|
10709
|
-
|
|
10710
|
-
|
|
10711
|
-
|
|
10703
|
+
], imports: [
|
|
10704
|
+
EditorDirective,
|
|
10705
|
+
FormsModule,
|
|
10706
|
+
RichTextEditorToolbarComponent,
|
|
10707
|
+
TableBubbleMenuComponent,
|
|
10708
|
+
ExtensionEnabledPipe,
|
|
10709
|
+
TruncateButtonComponent
|
|
10710
|
+
], template: "<div [class.viewMode]=\"mode() === 'view'\" [class.editMode]=\"mode() === 'edit'\" [class.disabled]=\"disabled\">\n @if (mode() === 'edit' && !disabled) {\n <lx-rich-text-editor-toolbar (mousedown)=\"$event.preventDefault()\" [editor]=\"editor()\" [isVisible]=\"toolbarVisibility()\">\n <ng-content select=\".diagram-btn\" ngProjectAs=\".diagram-btn\" />\n </lx-rich-text-editor-toolbar>\n }\n\n <tiptap-editor\n [editor]=\"editor()\"\n [outputFormat]=\"outputFormat()\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"blur.emit()\"\n [disabled]=\"mode() === 'view' || disabled\"\n />\n\n @if (('truncate' | lxExtensionEnabled: editor()) && mode() === 'view') {\n <lx-truncate-button [editor]=\"editor()\" />\n }\n</div>\n\n@if ('table' | lxExtensionEnabled: editor()) {\n <lx-table-bubble-menu [editor]=\"editor()\" />\n}\n\n<ng-content />\n", styles: [":host{display:flex;width:100%}.editorButton{margin:0 5px}.editMode{width:100%;border:1px solid #99a5bb;background-color:#fff;border-radius:2px}:host ::ng-deep .editMode .ProseMirror{padding:15px 18.9px;resize:vertical;max-height:var(--editor-max-height, auto)}.viewMode{width:100%}.disabled{background-color:#f0f2f5;color:#61779d}:host ::ng-deep .ProseMirror{outline-width:0;border-radius:2px;overflow:auto}:host ::ng-deep .ProseMirror-gapcursor:after{width:1px;height:14px;border-left:1px solid #000}:host ::ng-deep .ProseMirror p:first-child{margin-top:0}:host ::ng-deep .ProseMirror p:last-child{margin-bottom:0}:host ::ng-deep .ProseMirror h1:first-child,:host ::ng-deep .ProseMirror h2:first-child,:host ::ng-deep .ProseMirror h3:first-child,:host ::ng-deep .ProseMirror h4:first-child,:host ::ng-deep .ProseMirror h5:first-child,:host ::ng-deep .ProseMirror h6:first-child{margin-top:0}:host ::ng-deep .ProseMirror h1:last-child,:host ::ng-deep .ProseMirror h2:last-child,:host ::ng-deep .ProseMirror h3:last-child,:host ::ng-deep .ProseMirror h4:last-child,:host ::ng-deep .ProseMirror h5:last-child,:host ::ng-deep .ProseMirror h6:last-child{margin-bottom:0}:host ::ng-deep .ProseMirror h1{font-size:var(--lxFontHeader1Size)}:host ::ng-deep .ProseMirror h2{font-size:var(--lxFontHeader2Size)}:host ::ng-deep .ProseMirror h3{font-size:var(--lxFontHeader3Size)}:host ::ng-deep .ProseMirror h4{font-size:var(--lxFontHeader4Size)}:host ::ng-deep .ProseMirror .tableWrapper{margin:20px 0}:host ::ng-deep .ProseMirror .tableWrapper h1,:host ::ng-deep .ProseMirror .tableWrapper h2,:host ::ng-deep .ProseMirror .tableWrapper h3,:host ::ng-deep .ProseMirror .tableWrapper h4,:host ::ng-deep .ProseMirror .tableWrapper h5,:host ::ng-deep .ProseMirror .tableWrapper h6{margin-top:0}:host ::ng-deep .ProseMirror .tableWrapper table{border-collapse:collapse;margin:0;table-layout:fixed;width:100%}:host ::ng-deep .ProseMirror .tableWrapper table th,:host ::ng-deep .ProseMirror .tableWrapper table td{border:1px solid #c2c9d6;box-sizing:border-box;min-width:1em;padding:12px;position:relative;vertical-align:top}:host ::ng-deep .ProseMirror .tableWrapper table th>*,:host ::ng-deep .ProseMirror .tableWrapper table td>*{margin-bottom:0}:host ::ng-deep .ProseMirror .tableWrapper table th{background-color:#c2c9d6;font-weight:700;text-align:left}:host ::ng-deep .ProseMirror .tableWrapper table p{margin:0}:host ::ng-deep .ProseMirror .tableWrapper table .selectedCell:after{content:\"\";position:absolute;inset:0;pointer-events:none;z-index:2}:host ::ng-deep .ProseMirror .tableWrapper table .column-resize-handle{background-color:#b2bccc;bottom:-2px;right:-2px;position:absolute;top:0;width:4px;pointer-events:none}:host ::ng-deep .ProseMirror .selectedCell{background-color:#e1e5eb}:host ::ng-deep .ProseMirror .selector-column,:host ::ng-deep .ProseMirror .selector-row{all:unset;display:flex;align-items:center;justify-content:center;background-color:#f0f2f5;cursor:pointer;position:absolute;z-index:10;margin-left:-1px;margin-top:-.5px}:host ::ng-deep .ProseMirror .selector-column:hover,:host ::ng-deep .ProseMirror .selector-row:hover{background-color:#e1e5eb}:host ::ng-deep .ProseMirror .selector-column{width:calc(100% + 1px);border-left:1px solid #e1e5eb;height:11px;top:-11px;left:0}:host ::ng-deep .ProseMirror .selector-column.first{border-left:none}:host ::ng-deep .ProseMirror .selector-column.selected{background-color:#b2bccc;border-color:transparent}:host ::ng-deep .ProseMirror .selector-column.selected:before{content:\"\";border-bottom:2px dotted #fff;width:.6rem}:host ::ng-deep .ProseMirror .selector-column:hover:before{content:\"\";border-bottom:2px dotted #61779d;width:.6rem}:host ::ng-deep .ProseMirror .selector-column.selected:before{border-bottom:2px dotted #fff}:host ::ng-deep .ProseMirror .selector-row{height:calc(100% + 1px);border-top:1px solid #e1e5eb;width:11px;left:-11px;top:0}:host ::ng-deep .ProseMirror .selector-row.first{border-top:none}:host ::ng-deep .ProseMirror .selector-row.selected{background-color:#b2bccc;border-color:transparent}:host ::ng-deep .ProseMirror .selector-row.selected:before{content:\"\";border-left:2px dotted #fff;height:.575rem}:host ::ng-deep .ProseMirror .selector-row:hover:before{content:\"\";border-left:2px dotted #61779d;height:.575rem}:host ::ng-deep .ProseMirror .selector-row.selected:before{border-left:2px dotted #fff}:host ::ng-deep .ProseMirror li p{margin:0}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:24px}:host ::ng-deep .ProseMirror ol ol ol{list-style-type:decimal}:host ::ng-deep .ProseMirror ol ol{list-style-type:lower-alpha}:host ::ng-deep .ProseMirror ol ol ol{list-style-type:lower-roman}:host ::ng-deep .ProseMirror ol ol ol ol{list-style-type:decimal}:host ::ng-deep .ProseMirror ol ol ol ol ol{list-style-type:lower-alpha}:host ::ng-deep .ProseMirror ol ol ol ol ol ol{list-style-type:lower-roman}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol{list-style-type:decimal}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol ol{list-style-type:lower-alpha}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol ol ol{list-style-type:lower-roman}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol ol ol ol{list-style-type:decimal}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol ol ol ol ol{list-style-type:lower-alpha}:host ::ng-deep .ProseMirror ol ol ol ol ol ol ol ol ol ol ol ol{list-style-type:lower-roman}\n"] }]
|
|
10712
10711
|
}] });
|
|
10713
10712
|
|
|
10714
10713
|
class FocusEditorDirective {
|
|
@@ -11477,8 +11476,8 @@ __decorate([
|
|
|
11477
11476
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PopoverClickDirective, decorators: [{
|
|
11478
11477
|
type: Directive,
|
|
11479
11478
|
args: [{
|
|
11480
|
-
|
|
11481
|
-
|
|
11479
|
+
selector: '[lxPopoverClick]',
|
|
11480
|
+
exportAs: 'clickAnchor'
|
|
11482
11481
|
}]
|
|
11483
11482
|
}], ctorParameters: () => [{ type: i1$2.SatPopoverAnchorDirective }], propDecorators: { lxPopoverPinned: [{
|
|
11484
11483
|
type: Input
|
|
@@ -11553,8 +11552,8 @@ class PopoverHoverDirective {
|
|
|
11553
11552
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PopoverHoverDirective, decorators: [{
|
|
11554
11553
|
type: Directive,
|
|
11555
11554
|
args: [{
|
|
11556
|
-
|
|
11557
|
-
|
|
11555
|
+
selector: '[lxPopoverHover]',
|
|
11556
|
+
exportAs: 'hoverAnchor'
|
|
11558
11557
|
}]
|
|
11559
11558
|
}], ctorParameters: () => [{ type: i1$2.SatPopoverAnchorDirective }], propDecorators: { lxPopoverHover: [{
|
|
11560
11559
|
type: Input
|