coer-elements 2.0.52 → 2.0.54
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.
@@ -3978,11 +3978,11 @@ class CoerDropdown extends ControlValue {
|
|
3978
3978
|
});
|
3979
3979
|
}
|
3980
3980
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerDropdown, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
3981
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerDropdown, isStandalone: false, selector: "coer-dropdown", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, rowsByPage: { classPropertyName: "rowsByPage", publicName: "rowsByPage", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelected: "onSelected", onUnselect: "onUnselect" }, providers: [CONTROL_VALUE(CoerDropdown)], viewQueries: [{ propertyName: "_coerTextBox", first: true, predicate: ["coerTextBox"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"coer-form-field-component\">\r\n <div [id]=\"_id + '-container'\" class=\"coer-form-field-content\" [ngStyle]=\"{ \r\n width : width(), \r\n minWidth : minWidth(), \r\n maxWidth : maxWidth(),\r\n marginTop : marginTop(),\r\n marginRight : marginRight(),\r\n marginBottom: marginBottom(),\r\n marginLeft : marginLeft() \r\n }\"
|
3981
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerDropdown, isStandalone: false, selector: "coer-dropdown", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, rowsByPage: { classPropertyName: "rowsByPage", publicName: "rowsByPage", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelected: "onSelected", onUnselect: "onUnselect" }, providers: [CONTROL_VALUE(CoerDropdown)], viewQueries: [{ propertyName: "_coerTextBox", first: true, predicate: ["coerTextBox"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"coer-form-field-component\">\r\n <div [id]=\"_id + '-container'\" class=\"coer-form-field-content\" [ngStyle]=\"{ \r\n width : width(), \r\n minWidth : minWidth(), \r\n maxWidth : maxWidth(),\r\n marginTop : marginTop(),\r\n marginRight : marginRight(),\r\n marginBottom: marginBottom(),\r\n marginLeft : marginLeft() \r\n }\"> \r\n <div [ngClass]=\"{\r\n 'width-100' : true,\r\n 'readonly' : isReadonly() && !isLoading(),\r\n 'display-none' : isInvisible() || isLoading()\r\n }\">\r\n <coer-button\r\n [color]=\"color()\"\r\n [type]=\"type()\"\r\n [icon]=\"_icon\"\r\n [isLoading]=\"isLoading()\"\r\n [isDisabled]=\"isDisabled()\" \r\n width=\"100%\" \r\n [tooltip]=\"tooltip()\"\r\n [tooltipPosition]=\"tooltipPosition()\"\r\n (onClick)=\"_Toggle()\"\r\n > {{ _label }} </coer-button> \r\n </div>\r\n\r\n <!-- Options -->\r\n <div [id]=\"_id + '-dropdown-menu-container'\" class=\"dropdown-options display-none\">\r\n <ul [id]=\"_id + '-dropdown-menu'\">\r\n @if(_isEnable()) {\r\n @if(_dataSource().length <= 0) {\r\n <li class=\"no-options\">\r\n <div [id]=\"id + '-dropdown-option-' + -1\" class='dropdown-item cursor-pointer no-options'> -- No Options -- </div>\r\n </li>\r\n } \r\n \r\n @for(item of _dataSource(); track _GetIndexRow(item)) {\r\n <li [ngClass]=\"{ 'dropdown-item-focus': _index() == _GetIndexRow(item) }\" (click)=\"_SelectItem(item)\">\r\n <a [routerLink]=\"_GetPath(item)\">\r\n <div [id]=\"_id + '-dropdown-option-' + _GetIndexRow(item)\"> \r\n \r\n @if (_GetIcon(item).length > 0) {\r\n <span class=\"dropdown-menu-icon-container\">\r\n <i [class]=\"_GetIcon(item)\"></i>\r\n </span>\r\n }\r\n \r\n <span> {{ _GetDisplay(item) }} </span>\r\n </div> \r\n </a>\r\n </li>\r\n }\r\n }\r\n </ul>\r\n </div>\r\n\r\n <!-- Loading || Invisible -->\r\n @if(isLoading() || isInvisible()) {\r\n <div [ngClass]=\"{ \r\n 'loading' : isLoading(),\r\n 'invisible' : isInvisible() \r\n }\" \r\n [style]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'margin-top' : marginTop(),\r\n 'margin-right' : marginRight(),\r\n 'margin-bottom': marginBottom(),\r\n 'margin-left' : marginLeft(), \r\n }\"\r\n > {{ _label }} </div>\r\n } \r\n </div>\r\n</div> ", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "typeBreakpoint", "icon", "iconPosition", "path", "isLoading", "isDisabled", "isReadonly", "isInvisible", "width", "minWidth", "maxWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "tooltip", "tooltipPosition"], outputs: ["onClick"] }] }); }
|
3982
3982
|
}
|
3983
3983
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerDropdown, decorators: [{
|
3984
3984
|
type: Component,
|
3985
|
-
args: [{ selector: 'coer-dropdown', providers: [CONTROL_VALUE(CoerDropdown)], standalone: false, template: "<div class=\"coer-form-field-component\">\r\n <div [id]=\"_id + '-container'\" class=\"coer-form-field-content\" [ngStyle]=\"{ \r\n width : width(), \r\n minWidth : minWidth(), \r\n maxWidth : maxWidth(),\r\n marginTop : marginTop(),\r\n marginRight : marginRight(),\r\n marginBottom: marginBottom(),\r\n marginLeft : marginLeft() \r\n }\"
|
3985
|
+
args: [{ selector: 'coer-dropdown', providers: [CONTROL_VALUE(CoerDropdown)], standalone: false, template: "<div class=\"coer-form-field-component\">\r\n <div [id]=\"_id + '-container'\" class=\"coer-form-field-content\" [ngStyle]=\"{ \r\n width : width(), \r\n minWidth : minWidth(), \r\n maxWidth : maxWidth(),\r\n marginTop : marginTop(),\r\n marginRight : marginRight(),\r\n marginBottom: marginBottom(),\r\n marginLeft : marginLeft() \r\n }\"> \r\n <div [ngClass]=\"{\r\n 'width-100' : true,\r\n 'readonly' : isReadonly() && !isLoading(),\r\n 'display-none' : isInvisible() || isLoading()\r\n }\">\r\n <coer-button\r\n [color]=\"color()\"\r\n [type]=\"type()\"\r\n [icon]=\"_icon\"\r\n [isLoading]=\"isLoading()\"\r\n [isDisabled]=\"isDisabled()\" \r\n width=\"100%\" \r\n [tooltip]=\"tooltip()\"\r\n [tooltipPosition]=\"tooltipPosition()\"\r\n (onClick)=\"_Toggle()\"\r\n > {{ _label }} </coer-button> \r\n </div>\r\n\r\n <!-- Options -->\r\n <div [id]=\"_id + '-dropdown-menu-container'\" class=\"dropdown-options display-none\">\r\n <ul [id]=\"_id + '-dropdown-menu'\">\r\n @if(_isEnable()) {\r\n @if(_dataSource().length <= 0) {\r\n <li class=\"no-options\">\r\n <div [id]=\"id + '-dropdown-option-' + -1\" class='dropdown-item cursor-pointer no-options'> -- No Options -- </div>\r\n </li>\r\n } \r\n \r\n @for(item of _dataSource(); track _GetIndexRow(item)) {\r\n <li [ngClass]=\"{ 'dropdown-item-focus': _index() == _GetIndexRow(item) }\" (click)=\"_SelectItem(item)\">\r\n <a [routerLink]=\"_GetPath(item)\">\r\n <div [id]=\"_id + '-dropdown-option-' + _GetIndexRow(item)\"> \r\n \r\n @if (_GetIcon(item).length > 0) {\r\n <span class=\"dropdown-menu-icon-container\">\r\n <i [class]=\"_GetIcon(item)\"></i>\r\n </span>\r\n }\r\n \r\n <span> {{ _GetDisplay(item) }} </span>\r\n </div> \r\n </a>\r\n </li>\r\n }\r\n }\r\n </ul>\r\n </div>\r\n\r\n <!-- Loading || Invisible -->\r\n @if(isLoading() || isInvisible()) {\r\n <div [ngClass]=\"{ \r\n 'loading' : isLoading(),\r\n 'invisible' : isInvisible() \r\n }\" \r\n [style]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'margin-top' : marginTop(),\r\n 'margin-right' : marginRight(),\r\n 'margin-bottom': marginBottom(),\r\n 'margin-left' : marginLeft(), \r\n }\"\r\n > {{ _label }} </div>\r\n } \r\n </div>\r\n</div> " }]
|
3986
3986
|
}], ctorParameters: () => [] });
|
3987
3987
|
|
3988
3988
|
class CoerTab {
|
@@ -4295,11 +4295,11 @@ class CoerToolbar {
|
|
4295
4295
|
? '5px' : '0px';
|
4296
4296
|
}
|
4297
4297
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerToolbar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
4298
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerToolbar, isStandalone: false, selector: "coer-toolbar", inputs: { user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickMenu: "onClickMenu", onClickOption: "onClickOption" }, viewQueries: [{ propertyName: "_toogleButton", first: true, predicate: ["toogleButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar> \r\n @if(showLogo) {\r\n <div class=\"logo-image-container\" (click)=\"ToogleSideNave()\" [ngStyle]=\"{ 'width': _appLogoWidth }\">\r\n <div class=\"logo-image\" [ngStyle]=\"{ 'background-image': 'url(' + (_appLogoPath | noImage:'IMAGE') + ')' }\"></div>\r\n </div>\r\n }\r\n\r\n @else {\r\n <div class=\"button-container\">\r\n <button\r\n #toogleButton \r\n mat-icon-button \r\n type=\"button\"\r\n (click)=\"ToogleSideNave()\">\r\n <i class=\"icon-bars\"></i>\r\n </button>\r\n </div>\r\n\r\n <span class=\"app-name\"> {{ _appName }} </span> \r\n } \r\n\r\n <span class=\"fill-space\"></span> \r\n \r\n <div class=\"user-container\" (click)=\"dropdown.Open()\" [ngStyle]=\"{ \r\n 'padding-right': GetPadding('user-container'),\r\n 'display': showUser ? 'flex' : 'none'\r\n }\">\r\n <div class=\"position-absolute right-0px\">\r\n <coer-dropdown \r\n #dropdown\r\n [dataSource]=\"menu()\" \r\n propDisplay=\"label\" \r\n width=\"auto\"\r\n
|
4298
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerToolbar, isStandalone: false, selector: "coer-toolbar", inputs: { user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickMenu: "onClickMenu", onClickOption: "onClickOption" }, viewQueries: [{ propertyName: "_toogleButton", first: true, predicate: ["toogleButton"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar> \r\n @if(showLogo) {\r\n <div class=\"logo-image-container\" (click)=\"ToogleSideNave()\" [ngStyle]=\"{ 'width': _appLogoWidth }\">\r\n <div class=\"logo-image\" [ngStyle]=\"{ 'background-image': 'url(' + (_appLogoPath | noImage:'IMAGE') + ')' }\"></div>\r\n </div>\r\n }\r\n\r\n @else {\r\n <div class=\"button-container\">\r\n <button\r\n #toogleButton \r\n mat-icon-button \r\n type=\"button\"\r\n (click)=\"ToogleSideNave()\">\r\n <i class=\"icon-bars\"></i>\r\n </button>\r\n </div>\r\n\r\n <span class=\"app-name\"> {{ _appName }} </span> \r\n } \r\n\r\n <span class=\"fill-space\"></span> \r\n \r\n <div class=\"user-container\" (click)=\"dropdown.Open()\" [ngStyle]=\"{ \r\n 'padding-right': GetPadding('user-container'),\r\n 'display': showUser ? 'flex' : 'none'\r\n }\">\r\n <div class=\"position-absolute right-0px min-width-150px\">\r\n <coer-dropdown \r\n #dropdown\r\n [dataSource]=\"menu()\" \r\n propDisplay=\"label\" \r\n width=\"auto\" \r\n maxWidth=\"auto\"\r\n [minWidth]=\"GetElementWidth(toolbarUserIdentity)\"\r\n (onSelected)=\"onClickOption.emit($event); dropdown.Unselect()\"\r\n ></coer-dropdown>\r\n </div> \r\n\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + (image() | noImage:'USER') + ')' }\"></div>\r\n <div #toolbarUserIdentity id=\"toolbar-user-identity\" class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div> \r\n </div> \r\n \r\n @if(!showUser) {\r\n <span class=\"me-2\">\r\n <span class=\"fw-bold fa-fade\"> \r\n Loading <i class=\"fa-solid fa-sync fa-spin\"></i> \r\n </span> \r\n </span>\r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px!important;position:relative!important;z-index:10!important;padding:0!important;background-color:var(--toolbar-inner)!important;color:var(--toolbar-text-inner)!important}div#coer-tool-bar mat-toolbar span.app-name{height:40px!important;display:contents!important;max-width:45%}div#coer-tool-bar mat-toolbar div.logo-image-container{height:45px!important;min-width:100px}div#coer-tool-bar mat-toolbar div.logo-image-container div.logo-image{background-size:contain!important;background-repeat:no-repeat!important;background-position-y:bottom;width:100%!important;height:100%!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.button-container{display:flex;align-items:center;justify-content:center;width:40px}div#coer-tool-bar mat-toolbar div.button-container button{font-size:17px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:var(--sidenav-active)!important;background-color:transparent!important;padding:0!important;width:25px!important;height:25px!important;border:none!important}div#coer-tool-bar mat-toolbar div.button-container button:focus{box-shadow:0 0 20px!important}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:0px!important;max-height:0px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;position:relative!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;min-width:70px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i3$5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: CoerDropdown, selector: "coer-dropdown", inputs: ["id", "value", "label", "color", "type", "dataSource", "propDisplay", "rowsByPage", "isLoading", "isDisabled", "isReadonly", "isInvisible", "width", "minWidth", "maxWidth", "marginTop", "marginRight", "marginBottom", "marginLeft", "tooltip", "tooltipPosition"], outputs: ["onSelected", "onUnselect"] }, { kind: "pipe", type: i9.NoImagePipe, name: "noImage" }] }); }
|
4299
4299
|
}
|
4300
4300
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerToolbar, decorators: [{
|
4301
4301
|
type: Component,
|
4302
|
-
args: [{ selector: 'coer-toolbar', standalone: false, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar> \r\n @if(showLogo) {\r\n <div class=\"logo-image-container\" (click)=\"ToogleSideNave()\" [ngStyle]=\"{ 'width': _appLogoWidth }\">\r\n <div class=\"logo-image\" [ngStyle]=\"{ 'background-image': 'url(' + (_appLogoPath | noImage:'IMAGE') + ')' }\"></div>\r\n </div>\r\n }\r\n\r\n @else {\r\n <div class=\"button-container\">\r\n <button\r\n #toogleButton \r\n mat-icon-button \r\n type=\"button\"\r\n (click)=\"ToogleSideNave()\">\r\n <i class=\"icon-bars\"></i>\r\n </button>\r\n </div>\r\n\r\n <span class=\"app-name\"> {{ _appName }} </span> \r\n } \r\n\r\n <span class=\"fill-space\"></span> \r\n \r\n <div class=\"user-container\" (click)=\"dropdown.Open()\" [ngStyle]=\"{ \r\n 'padding-right': GetPadding('user-container'),\r\n 'display': showUser ? 'flex' : 'none'\r\n }\">\r\n <div class=\"position-absolute right-0px\">\r\n <coer-dropdown \r\n #dropdown\r\n [dataSource]=\"menu()\" \r\n propDisplay=\"label\" \r\n width=\"auto\"\r\n
|
4302
|
+
args: [{ selector: 'coer-toolbar', standalone: false, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar> \r\n @if(showLogo) {\r\n <div class=\"logo-image-container\" (click)=\"ToogleSideNave()\" [ngStyle]=\"{ 'width': _appLogoWidth }\">\r\n <div class=\"logo-image\" [ngStyle]=\"{ 'background-image': 'url(' + (_appLogoPath | noImage:'IMAGE') + ')' }\"></div>\r\n </div>\r\n }\r\n\r\n @else {\r\n <div class=\"button-container\">\r\n <button\r\n #toogleButton \r\n mat-icon-button \r\n type=\"button\"\r\n (click)=\"ToogleSideNave()\">\r\n <i class=\"icon-bars\"></i>\r\n </button>\r\n </div>\r\n\r\n <span class=\"app-name\"> {{ _appName }} </span> \r\n } \r\n\r\n <span class=\"fill-space\"></span> \r\n \r\n <div class=\"user-container\" (click)=\"dropdown.Open()\" [ngStyle]=\"{ \r\n 'padding-right': GetPadding('user-container'),\r\n 'display': showUser ? 'flex' : 'none'\r\n }\">\r\n <div class=\"position-absolute right-0px min-width-150px\">\r\n <coer-dropdown \r\n #dropdown\r\n [dataSource]=\"menu()\" \r\n propDisplay=\"label\" \r\n width=\"auto\" \r\n maxWidth=\"auto\"\r\n [minWidth]=\"GetElementWidth(toolbarUserIdentity)\"\r\n (onSelected)=\"onClickOption.emit($event); dropdown.Unselect()\"\r\n ></coer-dropdown>\r\n </div> \r\n\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + (image() | noImage:'USER') + ')' }\"></div>\r\n <div #toolbarUserIdentity id=\"toolbar-user-identity\" class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div> \r\n </div> \r\n \r\n @if(!showUser) {\r\n <span class=\"me-2\">\r\n <span class=\"fw-bold fa-fade\"> \r\n Loading <i class=\"fa-solid fa-sync fa-spin\"></i> \r\n </span> \r\n </span>\r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px!important;position:relative!important;z-index:10!important;padding:0!important;background-color:var(--toolbar-inner)!important;color:var(--toolbar-text-inner)!important}div#coer-tool-bar mat-toolbar span.app-name{height:40px!important;display:contents!important;max-width:45%}div#coer-tool-bar mat-toolbar div.logo-image-container{height:45px!important;min-width:100px}div#coer-tool-bar mat-toolbar div.logo-image-container div.logo-image{background-size:contain!important;background-repeat:no-repeat!important;background-position-y:bottom;width:100%!important;height:100%!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.button-container{display:flex;align-items:center;justify-content:center;width:40px}div#coer-tool-bar mat-toolbar div.button-container button{font-size:17px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:var(--sidenav-active)!important;background-color:transparent!important;padding:0!important;width:25px!important;height:25px!important;border:none!important}div#coer-tool-bar mat-toolbar div.button-container button:focus{box-shadow:0 0 20px!important}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:0px!important;max-height:0px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;position:relative!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;min-width:70px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"] }]
|
4303
4303
|
}] });
|
4304
4304
|
|
4305
4305
|
class ComponentsModule {
|