@eui/components 15.0.0-next.7 → 15.0.0-next.8
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/atoms/eui-icon/eui-icon-svg.component.d.ts +2 -2
- package/atoms/eui-icon/eui-icon-svg.component.d.ts.map +1 -1
- package/docs/components/EuiAlertComponent.html +1 -1
- package/docs/components/EuiAppComponent.html +0 -9
- package/docs/components/EuiCardFooterMenuContentComponent.html +1 -1
- package/docs/components/EuiCardHeaderComponent.html +1 -1
- package/docs/components/EuiIconSvgComponent.html +2 -2
- package/docs/components/EuiMenuComponent.html +1 -1
- package/docs/components/EuiMenuItemComponent.html +1 -1
- package/docs/components/EuiNotificationsComponent.html +1 -1
- package/docs/components/EuiSidebarToggleComponent.html +1 -1
- package/docs/index.html +2 -2
- package/docs/js/menu-wc.js +179 -20
- package/docs/js/menu-wc_es5.js +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/docs/miscellaneous/typealiases.html +2 -2
- package/docs/miscellaneous/variables.html +56 -82
- package/docs/modules/EuiAllModule.html +256 -22
- package/docs/modules/EuiAppModule.html +257 -23
- package/docs/modules/EuiLayoutModule.html +256 -22
- package/docs/modules.html +0 -12
- package/esm2020/atoms/eui-icon/eui-icon-svg.component.mjs +7 -7
- package/esm2020/atoms/eui-icon-toggle/eui-icon-toggle.component.mjs +1 -1
- package/esm2020/eui-alert/eui-alert.component.mjs +7 -7
- package/esm2020/eui-card/components/eui-card-footer/eui-card-footer-menu-content.component.mjs +3 -3
- package/esm2020/eui-card/components/eui-card-header/eui-card-header.component.mjs +3 -3
- package/esm2020/eui-fieldset/eui-fieldset.component.mjs +1 -1
- package/esm2020/eui-menu/eui-menu-item.component.mjs +3 -3
- package/esm2020/eui-menu/eui-menu.component.mjs +3 -3
- package/esm2020/layout/eui-app/eui-app-toolbar/toolbar.component.mjs +2 -2
- package/esm2020/layout/eui-app/eui-app.component.mjs +12 -11
- package/esm2020/layout/eui-notifications/eui-notifications.component.mjs +3 -3
- package/esm2020/layout/eui-sidebar-toggle/sidebar-toggle.component.mjs +3 -3
- package/esm2020/legacy/common/ux-pipes/index.mjs +1 -2
- package/esm2020/legacy/ux-all.module.mjs +1 -8
- package/fesm2015/eui-components-atoms-eui-icon-toggle.mjs +1 -1
- package/fesm2015/eui-components-atoms-eui-icon-toggle.mjs.map +1 -1
- package/fesm2015/eui-components-atoms-eui-icon.mjs +6 -6
- package/fesm2015/eui-components-atoms-eui-icon.mjs.map +1 -1
- package/fesm2015/eui-components-eui-alert.mjs +6 -6
- package/fesm2015/eui-components-eui-alert.mjs.map +1 -1
- package/fesm2015/eui-components-eui-card.mjs +4 -4
- package/fesm2015/eui-components-eui-card.mjs.map +1 -1
- package/fesm2015/eui-components-eui-fieldset.mjs +1 -1
- package/fesm2015/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2015/eui-components-eui-menu.mjs +4 -4
- package/fesm2015/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2015/eui-components-layout.mjs +17 -16
- package/fesm2015/eui-components-layout.mjs.map +1 -1
- package/fesm2015/eui-components-legacy-common-ux-pipes.mjs +1 -36
- package/fesm2015/eui-components-legacy-common-ux-pipes.mjs.map +1 -1
- package/fesm2015/eui-components-legacy.mjs +1 -7
- package/fesm2015/eui-components-legacy.mjs.map +1 -1
- package/fesm2020/eui-components-atoms-eui-icon-toggle.mjs +1 -1
- package/fesm2020/eui-components-atoms-eui-icon-toggle.mjs.map +1 -1
- package/fesm2020/eui-components-atoms-eui-icon.mjs +6 -6
- package/fesm2020/eui-components-atoms-eui-icon.mjs.map +1 -1
- package/fesm2020/eui-components-eui-alert.mjs +6 -6
- package/fesm2020/eui-components-eui-alert.mjs.map +1 -1
- package/fesm2020/eui-components-eui-card.mjs +4 -4
- package/fesm2020/eui-components-eui-card.mjs.map +1 -1
- package/fesm2020/eui-components-eui-fieldset.mjs +1 -1
- package/fesm2020/eui-components-eui-fieldset.mjs.map +1 -1
- package/fesm2020/eui-components-eui-menu.mjs +4 -4
- package/fesm2020/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2020/eui-components-layout.mjs +17 -16
- package/fesm2020/eui-components-layout.mjs.map +1 -1
- package/fesm2020/eui-components-legacy-common-ux-pipes.mjs +1 -36
- package/fesm2020/eui-components-legacy-common-ux-pipes.mjs.map +1 -1
- package/fesm2020/eui-components-legacy.mjs +1 -7
- package/fesm2020/eui-components-legacy.mjs.map +1 -1
- package/layout/eui-app/eui-app.component.d.ts +6 -6
- package/layout/eui-app/eui-app.component.d.ts.map +1 -1
- package/legacy/common/ux-pipes/index.d.ts +0 -1
- package/legacy/common/ux-pipes/index.d.ts.map +1 -1
- package/legacy/ux-all.module.d.ts +1 -1
- package/legacy/ux-all.module.d.ts.map +1 -1
- package/package.json +1 -1
- package/docs/modules/UxMomentTzPipeModule.html +0 -166
- package/docs/pipes/UxMomentTzPipe.html +0 -267
- package/esm2020/legacy/common/ux-pipes/ux-moment-tz.pipe.mjs +0 -39
- package/legacy/common/ux-pipes/ux-moment-tz.pipe.d.ts +0 -20
- package/legacy/common/ux-pipes/ux-moment-tz.pipe.d.ts.map +0 -1
|
@@ -354,10 +354,10 @@ class EuiSidebarToggleComponent extends BaseDirective {
|
|
|
354
354
|
}
|
|
355
355
|
}
|
|
356
356
|
/** @nocollapse */ EuiSidebarToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiSidebarToggleComponent, deps: [{ token: i1.UxAppShellService }], target: i0.ɵɵFactoryTarget.Component });
|
|
357
|
-
/** @nocollapse */ EuiSidebarToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "
|
|
357
|
+
/** @nocollapse */ EuiSidebarToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<eui-icon-svg icon=\"eui-menu\" size=\"l\" fillColor=\"grey-5\" (click)=\"onToggleSidebar($event)\"></eui-icon-svg>\n\n<!--\nRemoved : attr.aria-label=\"{{ (asService.state$ | async).isSidebarOpen ? 'Close Icon' : 'Bars Icon' }}\"\nTitle: WCAG 4.1.2: Ensures ARIA attributes are allowed for an element's role (.eui-icon-ecl-hamburger)\nTags: Accessibility, WCAG 4.1.2, aria-allowed-attr\n\nIssue: Ensures ARIA attributes are allowed for an element's role (aria-allowed-attr - https://accessibilityinsights.io/info-examples/web/aria-allowed-attr)\nTarget application: eUI - UX - http://localhost:4600/style-guide-next/components/eui-card\nElement path: .eui-icon-ecl-hamburger\nSnippet: <span euiicon=\"\" iconclass=\"eui-icon-ecl-hamburger\" ng-reflect-icon-class=\"eui-icon-ecl-hamburger\" aria-label=\"Close Icon\" class=\"eui-icon eui-icon-ecl-hamburger\"></span>\n\nHow to fix:\nFix all of the following:\n ARIA attribute cannot be used: aria-label\n\nEnvironment: Chrome version 90.0.4430.93\n\n====\n\nThis accessibility issue was found using Accessibility Insights for Web 2.26.0 (axe-core 4.2.0), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.\n-->\n", dependencies: [{ kind: "component", type: i2$2.EuiIconSvgComponent, selector: "span[euiIconSvg], i[euiIconSvg], eui-icon-svg", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "ariaHidden", "focusable", "isLoading"] }] });
|
|
358
358
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiSidebarToggleComponent, decorators: [{
|
|
359
359
|
type: Component,
|
|
360
|
-
args: [{ selector: 'eui-sidebar-toggle', template: "
|
|
360
|
+
args: [{ selector: 'eui-sidebar-toggle', template: "<eui-icon-svg icon=\"eui-menu\" size=\"l\" fillColor=\"grey-5\" (click)=\"onToggleSidebar($event)\"></eui-icon-svg>\n\n<!--\nRemoved : attr.aria-label=\"{{ (asService.state$ | async).isSidebarOpen ? 'Close Icon' : 'Bars Icon' }}\"\nTitle: WCAG 4.1.2: Ensures ARIA attributes are allowed for an element's role (.eui-icon-ecl-hamburger)\nTags: Accessibility, WCAG 4.1.2, aria-allowed-attr\n\nIssue: Ensures ARIA attributes are allowed for an element's role (aria-allowed-attr - https://accessibilityinsights.io/info-examples/web/aria-allowed-attr)\nTarget application: eUI - UX - http://localhost:4600/style-guide-next/components/eui-card\nElement path: .eui-icon-ecl-hamburger\nSnippet: <span euiicon=\"\" iconclass=\"eui-icon-ecl-hamburger\" ng-reflect-icon-class=\"eui-icon-ecl-hamburger\" aria-label=\"Close Icon\" class=\"eui-icon eui-icon-ecl-hamburger\"></span>\n\nHow to fix:\nFix all of the following:\n ARIA attribute cannot be used: aria-label\n\nEnvironment: Chrome version 90.0.4430.93\n\n====\n\nThis accessibility issue was found using Accessibility Insights for Web 2.26.0 (axe-core 4.2.0), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.\n-->\n" }]
|
|
361
361
|
}], ctorParameters: function () { return [{ type: i1.UxAppShellService }]; }, propDecorators: { cssClasses: [{
|
|
362
362
|
type: HostBinding,
|
|
363
363
|
args: ['class']
|
|
@@ -883,10 +883,10 @@ class EuiNotificationsComponent {
|
|
|
883
883
|
}
|
|
884
884
|
}
|
|
885
885
|
/** @nocollapse */ EuiNotificationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
886
|
-
/** @nocollapse */ EuiNotificationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiNotificationsComponent, selector: "eui-notifications", inputs: { count: "count", items: "items", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", noNotificationFoundLabel: "noNotificationFoundLabel", noNotificationFoundLink: "noNotificationFoundLink", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { listeners: { "body:click": "onHide()" }, properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<!-- <eui-icon role=\"button\" euiSizeL iconClass=\"eui-icon-bell\" styleClass=\"eui-u-cursor-pointer\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon> -->\n<eui-icon-svg role=\"button\" size=\"m\" icon=\"notifications\"
|
|
886
|
+
/** @nocollapse */ EuiNotificationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiNotificationsComponent, selector: "eui-notifications", inputs: { count: "count", items: "items", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", noNotificationFoundLabel: "noNotificationFoundLabel", noNotificationFoundLink: "noNotificationFoundLink", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { listeners: { "body:click": "onHide()" }, properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<!-- <eui-icon role=\"button\" euiSizeL iconClass=\"eui-icon-bell\" styleClass=\"eui-u-cursor-pointer\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon> -->\n<eui-icon-svg role=\"button\" size=\"m\" icon=\"eui-notifications\" styleClass=\"eui-u-cursor-pointer\" fillColor=\"grey-5\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\">\n <eui-overlay-header>\n <div class=\"eui-notifications__header-title\">\n <div class=\"eui-notifications__header-title-label\">\n {{headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS'| translate)}}\n <span *ngIf=\"items\" class=\"eui-u-cursor-help eui-u-ml-s\"\n attr.aria-label=\"{{unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD'| translate)}}\"\n title=\"{{unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD'| translate)}}\">\n </span>\n <eui-badge euiSizeL *ngIf=\"count\">{{ count }}</eui-badge>\n <eui-badge euiSizeL *ngIf=\"!count\">{{ items.length }}</eui-badge>\n </div>\n </div>\n\n <div *ngIf=\"items\" class=\"eui-notifications__header-actions\">\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowMarkAllAsReadButton\"\n [attr.aria-label]=\"markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate)\"\n title=\"{{ markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate) }}\"\n (click)=\"onMarkAllAsRead($event)\">\n <eui-icon-svg icon=\"eui-checkmark-done\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowSettingsButton\"\n [attr.aria-label]=\"settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate)\"\n title=\"{{ settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate) }}\"\n (click)=\"onSettings($event)\">\n <eui-icon-svg icon=\"eui-settings\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowRefreshButton\"\n [attr.aria-label]=\"refreshLabel ? refreshLabel : ('eui.REFRESH' | translate)\"\n title=\"{{ refreshLabel ? refreshLabel : ('eui.REFRESH' | translate) }}\"\n (click)=\"onRefresh($event)\">\n <eui-icon-svg icon=\"eui-refresh\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n </div>\n </eui-overlay-header>\n\n <eui-overlay-body>\n <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n <eui-notification-item\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [item]=\"item\"\n [dateFormat]=\"dateFormat\"\n [markAsReadLabel]=\"markAsReadLabel\"\n [isShowMarkAsRead]=\"isShowMarkAsRead\"\n (itemClick)=\"onItemClick($event)\"\n (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n </eui-notification-item>\n </ul>\n </eui-overlay-body>\n\n <eui-overlay-footer>\n <ng-template [ngIf]=\"items?.length > 0\">\n <strong><a\n (click)=\"onViewAllClick($event)\">{{viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS'| translate)}}</a></strong>\n </ng-template>\n <ng-template [ngIf]=\"items?.length === 0\">\n <div class=\"ux-notification__item-content\"\n *ngIf=\"!noNotificationFoundLink\">{{noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND'| translate)}}</div>\n <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n <strong><a\n (click)=\"onNoNotificationFoundClick($event)\">{{noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND'| translate)}}</a></strong>\n </div>\n </ng-template>\n </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-base-color-grey-10);border-bottom:1px solid var(--eui-base-color-grey-20)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font-size:var(--eui-base-font-size-l);font-style:normal;font-weight:700}.eui-notifications__header-title-subLabel{font-size:var(--eui-base-font-size-s);margin-top:var(--eui-base-spacing-xs);font-family:var(--eui-base-font-family);font-size:var(--eui-base-font-size);font-style:normal;font-weight:400}.eui-notifications__header-actions{align-items:center;display:flex;margin-left:auto}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-info-5);border-bottom:1px solid #dfdfdf;display:flex;flex-direction:column;min-height:82px;padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2$3.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2$3.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2$3.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "position", "width"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }, { kind: "component", type: i4$1.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["aria-label"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "span[euiIconSvg], i[euiIconSvg], eui-icon-svg", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: EuiNotificationItemComponent, selector: "eui-notification-item", inputs: ["item", "dateFormat", "isShowMarkAsRead", "markAsReadLabel"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
887
887
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiNotificationsComponent, decorators: [{
|
|
888
888
|
type: Component,
|
|
889
|
-
args: [{ selector: 'eui-notifications', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!-- <eui-icon role=\"button\" euiSizeL iconClass=\"eui-icon-bell\" styleClass=\"eui-u-cursor-pointer\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon> -->\n<eui-icon-svg role=\"button\" size=\"m\" icon=\"notifications\"
|
|
889
|
+
args: [{ selector: 'eui-notifications', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!-- <eui-icon role=\"button\" euiSizeL iconClass=\"eui-icon-bell\" styleClass=\"eui-u-cursor-pointer\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon> -->\n<eui-icon-svg role=\"button\" size=\"m\" icon=\"eui-notifications\" styleClass=\"eui-u-cursor-pointer\" fillColor=\"grey-5\" (click)=\"onClicked($event)\">\n <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{count}}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\">\n <eui-overlay-header>\n <div class=\"eui-notifications__header-title\">\n <div class=\"eui-notifications__header-title-label\">\n {{headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS'| translate)}}\n <span *ngIf=\"items\" class=\"eui-u-cursor-help eui-u-ml-s\"\n attr.aria-label=\"{{unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD'| translate)}}\"\n title=\"{{unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD'| translate)}}\">\n </span>\n <eui-badge euiSizeL *ngIf=\"count\">{{ count }}</eui-badge>\n <eui-badge euiSizeL *ngIf=\"!count\">{{ items.length }}</eui-badge>\n </div>\n </div>\n\n <div *ngIf=\"items\" class=\"eui-notifications__header-actions\">\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowMarkAllAsReadButton\"\n [attr.aria-label]=\"markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate)\"\n title=\"{{ markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate) }}\"\n (click)=\"onMarkAllAsRead($event)\">\n <eui-icon-svg icon=\"eui-checkmark-done\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowSettingsButton\"\n [attr.aria-label]=\"settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate)\"\n title=\"{{ settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate) }}\"\n (click)=\"onSettings($event)\">\n <eui-icon-svg icon=\"eui-settings\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n <button euiButton euiPrimary euiRounded euiIconButton euiBasicButton euiSizeS\n *ngIf=\"isShowRefreshButton\"\n [attr.aria-label]=\"refreshLabel ? refreshLabel : ('eui.REFRESH' | translate)\"\n title=\"{{ refreshLabel ? refreshLabel : ('eui.REFRESH' | translate) }}\"\n (click)=\"onRefresh($event)\">\n <eui-icon-svg icon=\"eui-refresh\" fillColor=\"primary-100\"></eui-icon-svg>\n </button>\n </div>\n </eui-overlay-header>\n\n <eui-overlay-body>\n <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n <eui-notification-item\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [item]=\"item\"\n [dateFormat]=\"dateFormat\"\n [markAsReadLabel]=\"markAsReadLabel\"\n [isShowMarkAsRead]=\"isShowMarkAsRead\"\n (itemClick)=\"onItemClick($event)\"\n (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n </eui-notification-item>\n </ul>\n </eui-overlay-body>\n\n <eui-overlay-footer>\n <ng-template [ngIf]=\"items?.length > 0\">\n <strong><a\n (click)=\"onViewAllClick($event)\">{{viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS'| translate)}}</a></strong>\n </ng-template>\n <ng-template [ngIf]=\"items?.length === 0\">\n <div class=\"ux-notification__item-content\"\n *ngIf=\"!noNotificationFoundLink\">{{noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND'| translate)}}</div>\n <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n <strong><a\n (click)=\"onNoNotificationFoundClick($event)\">{{noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND'| translate)}}</a></strong>\n </div>\n </ng-template>\n </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-base-color-grey-10);border-bottom:1px solid var(--eui-base-color-grey-20)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font-size:var(--eui-base-font-size-l);font-style:normal;font-weight:700}.eui-notifications__header-title-subLabel{font-size:var(--eui-base-font-size-s);margin-top:var(--eui-base-spacing-xs);font-family:var(--eui-base-font-family);font-size:var(--eui-base-font-size);font-style:normal;font-weight:400}.eui-notifications__header-actions{align-items:center;display:flex;margin-left:auto}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-info-5);border-bottom:1px solid #dfdfdf;display:flex;flex-direction:column;min-height:82px;padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"] }]
|
|
890
890
|
}], ctorParameters: function () { return []; }, propDecorators: { string: [{
|
|
891
891
|
type: HostBinding,
|
|
892
892
|
args: ['class']
|
|
@@ -1396,10 +1396,10 @@ class EuiAppToolbarComponent {
|
|
|
1396
1396
|
}
|
|
1397
1397
|
}
|
|
1398
1398
|
/** @nocollapse */ EuiAppToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiAppToolbarComponent, deps: [{ token: i1.UxAppShellService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1399
|
-
/** @nocollapse */ EuiAppToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiAppToolbarComponent, selector: "eui-app-toolbar", host: { properties: { "class": "this.string", "attr.role": "this.role" } }, ngImport: i0, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" styleClass=\"eui-app-toolbar__sidebar-toggle\">\n</eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container *ngIf=\"!(asService.getState('hasHeader') | async | coerceBool) || ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\">\n <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\">\n </eui-language-selector>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-app-toolbar-bg-color);color:var(--eui-app-toolbar-color);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding:0 0 0 var(--eui-base-spacing-m)}.eui-app-toolbar__sidebar-toggle .eui-icon{cursor:pointer}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EuiSidebarToggleComponent, selector: "eui-sidebar-toggle" }, { kind: "component", type: EuiLanguageSelectorComponent, selector: "eui-language-selector" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.EuiCoerceBooleanPipe, name: "coerceBool" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
1399
|
+
/** @nocollapse */ EuiAppToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiAppToolbarComponent, selector: "eui-app-toolbar", host: { properties: { "class": "this.string", "attr.role": "this.role" } }, ngImport: i0, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" styleClass=\"eui-app-toolbar__sidebar-toggle\">\n</eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container *ngIf=\"!(asService.getState('hasHeader') | async | coerceBool) || ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\">\n <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\">\n </eui-language-selector>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-app-toolbar-bg-color);color:var(--eui-app-toolbar-color);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding:0 0 0 var(--eui-base-spacing-m);width:3rem}.eui-app-toolbar__sidebar-toggle .eui-icon,.eui-app-toolbar__sidebar-toggle .eui-icon-svg{cursor:pointer}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EuiSidebarToggleComponent, selector: "eui-sidebar-toggle" }, { kind: "component", type: EuiLanguageSelectorComponent, selector: "eui-language-selector" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.EuiCoerceBooleanPipe, name: "coerceBool" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
1400
1400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiAppToolbarComponent, decorators: [{
|
|
1401
1401
|
type: Component,
|
|
1402
|
-
args: [{ selector: 'eui-app-toolbar', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" styleClass=\"eui-app-toolbar__sidebar-toggle\">\n</eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container *ngIf=\"!(asService.getState('hasHeader') | async | coerceBool) || ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\">\n <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\">\n </eui-language-selector>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-app-toolbar-bg-color);color:var(--eui-app-toolbar-color);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding:0 0 0 var(--eui-base-spacing-m)}.eui-app-toolbar__sidebar-toggle .eui-icon{cursor:pointer}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"] }]
|
|
1402
|
+
args: [{ selector: 'eui-app-toolbar', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" styleClass=\"eui-app-toolbar__sidebar-toggle\">\n</eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container *ngIf=\"!(asService.getState('hasHeader') | async | coerceBool) || ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\">\n <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\">\n </eui-language-selector>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-app-toolbar-bg-color);color:var(--eui-app-toolbar-color);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding:0 0 0 var(--eui-base-spacing-m);width:3rem}.eui-app-toolbar__sidebar-toggle .eui-icon,.eui-app-toolbar__sidebar-toggle .eui-icon-svg{cursor:pointer}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"] }]
|
|
1403
1403
|
}], ctorParameters: function () { return [{ type: i1.UxAppShellService }]; }, propDecorators: { string: [{
|
|
1404
1404
|
type: HostBinding,
|
|
1405
1405
|
args: ['class']
|
|
@@ -1452,12 +1452,12 @@ class EuiAppComponent {
|
|
|
1452
1452
|
this.cssClasses = 'eui-app';
|
|
1453
1453
|
this.appSubTitle = '';
|
|
1454
1454
|
this.themeClass = '';
|
|
1455
|
+
this.userInfos = '';
|
|
1456
|
+
this.hasNoPageWrapper = false;
|
|
1455
1457
|
this._isSidebarOpen = false;
|
|
1456
1458
|
this._isSidebarExpandOnHover = true;
|
|
1457
1459
|
this._isShrinkHeaderActive = true;
|
|
1458
|
-
this.userInfos = '';
|
|
1459
1460
|
this._isSidebarHidden = false;
|
|
1460
|
-
this.hasNoPageWrapper = false;
|
|
1461
1461
|
this.destroy$ = new Subject();
|
|
1462
1462
|
}
|
|
1463
1463
|
get isSidebarOpen() { return this._isSidebarOpen; }
|
|
@@ -1475,6 +1475,7 @@ class EuiAppComponent {
|
|
|
1475
1475
|
this.asService.fetchCssVars();
|
|
1476
1476
|
this.asService.initCssVars();
|
|
1477
1477
|
const deviceInfo = this.deviceDetectorService.getDeviceInfo();
|
|
1478
|
+
console.log(deviceInfo);
|
|
1478
1479
|
this.asService.setState({
|
|
1479
1480
|
...this.asService.state,
|
|
1480
1481
|
windowHeight: window.innerHeight,
|
|
@@ -1551,7 +1552,7 @@ class EuiAppComponent {
|
|
|
1551
1552
|
}
|
|
1552
1553
|
}
|
|
1553
1554
|
/** @nocollapse */ EuiAppComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiAppComponent, deps: [{ token: i1.UxAppShellService }, { token: i2$4.DeviceDetectorService }, { token: i0.ChangeDetectorRef }, { token: EUI_CONFIG_TOKEN }], target: i0.ɵɵFactoryTarget.Component });
|
|
1554
|
-
/** @nocollapse */ EuiAppComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiAppComponent, selector: "eui-app", inputs: { appSubTitle: "appSubTitle", themeClass: "themeClass",
|
|
1555
|
+
/** @nocollapse */ EuiAppComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EuiAppComponent, selector: "eui-app", inputs: { appSubTitle: "appSubTitle", themeClass: "themeClass", userInfos: "userInfos", userSubInfos: "userSubInfos", impersonatedUserInfos: "impersonatedUserInfos", isSidebarOpen: "isSidebarOpen", isSidebarExpandOnHover: "isSidebarExpandOnHover", isShrinkHeaderActive: "isShrinkHeaderActive", isSidebarHidden: "isSidebarHidden" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "customPageWrapper", first: true, predicate: i0.forwardRef(function () { return EuiAppPageWrapperDirective; }), descendants: true }, { propertyName: "appToolbar", first: true, predicate: i0.forwardRef(function () { return EuiAppToolbarComponent; }), descendants: true }, { propertyName: "destroy$", first: true, predicate: i0.forwardRef(function () { return EuiAppSidebarComponent; }), descendants: true }], usesOnChanges: true, ngImport: i0, template: "<eui-dimmer [isDimmerActive]=\"(asService.state$ | async).isDimmerActive\"></eui-dimmer>\n\n<ng-content select=\"eui-app-sidebar\"></ng-content>\n<ng-container *ngIf=\"!appSidebar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile\">\n <eui-app-sidebar>\n <eui-app-sidebar-body>\n <eui-app-sidebar-menu [items]=\"(asService.state$ | async).menuLinks\" [hasIcons]=\"true\"></eui-app-sidebar-menu>\n </eui-app-sidebar-body>\n </eui-app-sidebar>\n</ng-container>\n\n<div class=\"eui-app-main\">\n <ng-content select=\"eui-app-top-message\"></ng-content>\n\n <ng-content select=\"eui-app-header\"></ng-content>\n\n <ng-container *ngIf=\"!appToolbar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile; else elseBlockToolbar\">\n <eui-app-toolbar>\n <eui-toolbar></eui-toolbar>\n </eui-app-toolbar>\n </ng-container>\n\n <ng-template #elseBlockToolbar>\n <ng-content select=\"eui-app-toolbar\"></ng-content>\n </ng-template>\n\n <div class=\"eui-app-main-content\" role=\"main\">\n <ng-content select=\"eui-app-page-wrapper\"></ng-content>\n <!-- TODO: consider removing code below in the future by transferring responsibility of providing <router-outlet> to the developer -->\n <ng-container *ngIf=\"hasNoPageWrapper\">\n <router-outlet></router-outlet>\n </ng-container>\n </div>\n\n <ng-content select=\"eui-app-footer\"></ng-content>\n</div>\n\n<eui-growl [value]=\"asService.growlMessages\" [sticky]=\"asService.isGrowlSticky\" [life]=\"asService.growlLife\"\n [position]=\"asService.growlPosition\" (clicked)=\"asService.growlCallback()\"></eui-growl>\n\n<eui-block-document [isBlocked]=\"(asService.state$ | async).isBlockDocumentActive\"></eui-block-document>\n", styles: [".eui-app{display:flex;overflow:hidden}@media screen and (max-width: 767px){.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 996px){.sidebar--hidden.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}.eui-app-main{min-height:100vh;background:var(--eui-app-main-bg-color);width:calc(100% - var(--eui-app-sidebar-width));margin-left:var(--eui-app-sidebar-width);display:flex;flex-direction:column;transition:margin .1s ease-in,width .1s ease-in}@media screen and (max-width: 767px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 996px){.sidebar--close .eui-app-main{margin-left:var(--eui-app-sidebar-width-close);width:calc(100% - var(--eui-app-sidebar-width-close))}.sidebar--hidden.sidebar--close .eui-app-main,.sidebar--hidden.sidebar--open .eui-app-main{margin-left:0;width:100%}}.eui-app-main-content{flex-grow:1;margin-top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));position:relative}eui-app-page-wrapper{display:flex;width:100%}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: EuiAppToolbarComponent, selector: "eui-app-toolbar" }, { kind: "component", type: EuiToolbarComponent, selector: "eui-toolbar" }, { kind: "component", type: EuiAppSidebarComponent, selector: "eui-app-sidebar" }, { kind: "component", type: EuiAppSidebarBodyComponent, selector: "eui-app-sidebar-body" }, { kind: "component", type: EuiAppSidebarMenuComponent, selector: "eui-app-sidebar-menu", inputs: ["items", "hasFilter", "hasIcons", "hasTooltip", "expandAllItems"], outputs: ["onSidebarItemClicked"] }, { kind: "component", type: i10.EuiBlockDocumentComponent, selector: "eui-block-document", inputs: ["isBlocked"] }, { kind: "component", type: i11.EuiGrowlComponent, selector: "eui-growl", inputs: ["sticky", "life", "value", "style", "styleClass", "position", "e2eAttr"], outputs: ["clicked"] }, { kind: "component", type: i12.EuiDimmerComponent, selector: "eui-dimmer", inputs: ["isDimmerActive", "e2eAttr"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1555
1556
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EuiAppComponent, decorators: [{
|
|
1556
1557
|
type: Component,
|
|
1557
1558
|
args: [{ selector: 'eui-app', encapsulation: ViewEncapsulation.None, template: "<eui-dimmer [isDimmerActive]=\"(asService.state$ | async).isDimmerActive\"></eui-dimmer>\n\n<ng-content select=\"eui-app-sidebar\"></ng-content>\n<ng-container *ngIf=\"!appSidebar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile\">\n <eui-app-sidebar>\n <eui-app-sidebar-body>\n <eui-app-sidebar-menu [items]=\"(asService.state$ | async).menuLinks\" [hasIcons]=\"true\"></eui-app-sidebar-menu>\n </eui-app-sidebar-body>\n </eui-app-sidebar>\n</ng-container>\n\n<div class=\"eui-app-main\">\n <ng-content select=\"eui-app-top-message\"></ng-content>\n\n <ng-content select=\"eui-app-header\"></ng-content>\n\n <ng-container *ngIf=\"!appToolbar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile; else elseBlockToolbar\">\n <eui-app-toolbar>\n <eui-toolbar></eui-toolbar>\n </eui-app-toolbar>\n </ng-container>\n\n <ng-template #elseBlockToolbar>\n <ng-content select=\"eui-app-toolbar\"></ng-content>\n </ng-template>\n\n <div class=\"eui-app-main-content\" role=\"main\">\n <ng-content select=\"eui-app-page-wrapper\"></ng-content>\n <!-- TODO: consider removing code below in the future by transferring responsibility of providing <router-outlet> to the developer -->\n <ng-container *ngIf=\"hasNoPageWrapper\">\n <router-outlet></router-outlet>\n </ng-container>\n </div>\n\n <ng-content select=\"eui-app-footer\"></ng-content>\n</div>\n\n<eui-growl [value]=\"asService.growlMessages\" [sticky]=\"asService.isGrowlSticky\" [life]=\"asService.growlLife\"\n [position]=\"asService.growlPosition\" (clicked)=\"asService.growlCallback()\"></eui-growl>\n\n<eui-block-document [isBlocked]=\"(asService.state$ | async).isBlockDocumentActive\"></eui-block-document>\n", styles: [".eui-app{display:flex;overflow:hidden}@media screen and (max-width: 767px){.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 996px){.sidebar--hidden.eui-app.sidebar--open:before{background:rgba(0,0,0,.3);bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height));transition:all .1s ease;width:100vw;z-index:980}}.eui-app-main{min-height:100vh;background:var(--eui-app-main-bg-color);width:calc(100% - var(--eui-app-sidebar-width));margin-left:var(--eui-app-sidebar-width);display:flex;flex-direction:column;transition:margin .1s ease-in,width .1s ease-in}@media screen and (max-width: 767px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 996px){.sidebar--close .eui-app-main{margin-left:var(--eui-app-sidebar-width-close);width:calc(100% - var(--eui-app-sidebar-width-close))}.sidebar--hidden.sidebar--close .eui-app-main,.sidebar--hidden.sidebar--open .eui-app-main{margin-left:0;width:100%}}.eui-app-main-content{flex-grow:1;margin-top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));position:relative}eui-app-page-wrapper{display:flex;width:100%}\n"] }]
|
|
@@ -1565,18 +1566,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
|
|
|
1565
1566
|
type: Input
|
|
1566
1567
|
}], themeClass: [{
|
|
1567
1568
|
type: Input
|
|
1568
|
-
}], isSidebarOpen: [{
|
|
1569
|
-
type: Input
|
|
1570
|
-
}], isSidebarExpandOnHover: [{
|
|
1571
|
-
type: Input
|
|
1572
|
-
}], isShrinkHeaderActive: [{
|
|
1573
|
-
type: Input
|
|
1574
1569
|
}], userInfos: [{
|
|
1575
1570
|
type: Input
|
|
1576
1571
|
}], userSubInfos: [{
|
|
1577
1572
|
type: Input
|
|
1578
1573
|
}], impersonatedUserInfos: [{
|
|
1579
1574
|
type: Input
|
|
1575
|
+
}], isSidebarOpen: [{
|
|
1576
|
+
type: Input
|
|
1577
|
+
}], isSidebarExpandOnHover: [{
|
|
1578
|
+
type: Input
|
|
1579
|
+
}], isShrinkHeaderActive: [{
|
|
1580
|
+
type: Input
|
|
1580
1581
|
}], isSidebarHidden: [{
|
|
1581
1582
|
type: Input
|
|
1582
1583
|
}], customPageWrapper: [{
|
|
@@ -1585,7 +1586,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
|
|
|
1585
1586
|
}], appToolbar: [{
|
|
1586
1587
|
type: ContentChild,
|
|
1587
1588
|
args: [forwardRef(() => EuiAppToolbarComponent)]
|
|
1588
|
-
}],
|
|
1589
|
+
}], destroy$: [{
|
|
1589
1590
|
type: ContentChild,
|
|
1590
1591
|
args: [forwardRef(() => EuiAppSidebarComponent)]
|
|
1591
1592
|
}] } });
|