@smartbit4all/ng-client 6.0.29 → 6.0.30
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/esm2022/lib/view-context/smart-ui-action/file-editor-toolbar/file-editor-toolbar.component.mjs +2 -2
- package/esm2022/lib/view-context/smart-ui-action/ui-action-toolbar.component.mjs +2 -2
- package/fesm2022/smartbit4all-ng-client.mjs +4 -4
- package/fesm2022/smartbit4all-ng-client.mjs.map +1 -1
- package/package.json +1 -1
- package/smartbit4all-ng-client-6.0.30.tgz +0 -0
- package/smartbit4all-ng-client-6.0.29.tgz +0 -0
|
@@ -22,11 +22,11 @@ export class FileEditorToolbarComponent extends UiActionToolbarComponent {
|
|
|
22
22
|
await super.fireAction(uiActionModel);
|
|
23
23
|
}
|
|
24
24
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: i3.ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i4.HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i5.ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: i3.ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i4.HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i5.ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
26
26
|
}
|
|
27
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
|
-
args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
29
|
+
args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
30
30
|
}], propDecorators: { dataUri: [{
|
|
31
31
|
type: Input
|
|
32
32
|
}], actionEvent: [{
|
|
@@ -316,11 +316,11 @@ export class UiActionToolbarComponent {
|
|
|
316
316
|
return MenuTriggerType;
|
|
317
317
|
}
|
|
318
318
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, deps: [{ token: i1.UiActionService }, { token: i0.Injector }, { token: i2.UiMenuService }, { token: i0.ChangeDetectorRef }, { token: COMPONENT_LIBRARY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
319
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: i5.ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i6.HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i7.ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
319
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: i5.ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i6.HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: i7.ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
320
320
|
}
|
|
321
321
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, decorators: [{
|
|
322
322
|
type: Component,
|
|
323
|
-
args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
323
|
+
args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
324
324
|
}], ctorParameters: () => [{ type: i1.UiActionService }, { type: i0.Injector }, { type: i2.UiMenuService }, { type: i0.ChangeDetectorRef }, { type: i8.ComponentLibrary, decorators: [{
|
|
325
325
|
type: Inject,
|
|
326
326
|
args: [COMPONENT_LIBRARY]
|
|
@@ -7388,11 +7388,11 @@ class UiActionToolbarComponent {
|
|
|
7388
7388
|
return MenuTriggerType;
|
|
7389
7389
|
}
|
|
7390
7390
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, deps: [{ token: UiActionService }, { token: i0.Injector }, { token: UiMenuService }, { token: i0.ChangeDetectorRef }, { token: COMPONENT_LIBRARY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7391
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
7391
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
7392
7392
|
}
|
|
7393
7393
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, decorators: [{
|
|
7394
7394
|
type: Component,
|
|
7395
|
-
args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
7395
|
+
args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
7396
7396
|
}], ctorParameters: () => [{ type: UiActionService }, { type: i0.Injector }, { type: UiMenuService }, { type: i0.ChangeDetectorRef }, { type: ComponentLibrary, decorators: [{
|
|
7397
7397
|
type: Inject,
|
|
7398
7398
|
args: [COMPONENT_LIBRARY]
|
|
@@ -8427,11 +8427,11 @@ class FileEditorToolbarComponent extends UiActionToolbarComponent {
|
|
|
8427
8427
|
await super.fireAction(uiActionModel);
|
|
8428
8428
|
}
|
|
8429
8429
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
8430
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
8430
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection", "toolbarId"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
|
|
8431
8431
|
}
|
|
8432
8432
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, decorators: [{
|
|
8433
8433
|
type: Component,
|
|
8434
|
-
args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
8434
|
+
args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n (mouseenter)=\"onHover()\"\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [toolbarId]=\"id\"\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n (mouseenter)=\"onHover()\"\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
|
|
8435
8435
|
}], propDecorators: { dataUri: [{
|
|
8436
8436
|
type: Input
|
|
8437
8437
|
}], actionEvent: [{
|