@nova-ui/bits
Version:
SolarWinds Nova Framework
453 lines • 88.5 kB
JavaScript
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to
// deal in the Software without restriction, including without limitation the
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
// sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
import { animate, AnimationBuilder, style, } from "@angular/animations";
import { ChangeDetectorRef, Component, EventEmitter, Input, Output, Renderer2, ViewChild, ViewContainerRef, ViewEncapsulation, } from "@angular/core";
import isUndefined from "lodash/isUndefined";
import { Subject } from "rxjs";
import { debounceTime, distinctUntilChanged, filter } from "rxjs/operators";
import { PanelBackgroundColor, PanelModes, PanelStates, SizeParameters, } from "./public-api";
import * as i0 from "@angular/core";
import * as i1 from "@angular/animations";
import * as i2 from "@angular/common";
import * as i3 from "../../common/directives/resizer/resizer.directive";
import * as i4 from "../button/button.component";
// <example-url>./../examples/index.html#/panel</example-url>
const panelMap = {
top: {
orientation: "top",
icon: {
collapsed: "double-caret-down",
opened: "double-caret-up",
},
},
bottom: {
orientation: "bottom",
icon: {
collapsed: "double-caret-up",
opened: "double-caret-down",
},
},
right: {
orientation: "right",
icon: {
collapsed: "double-caret-left",
opened: "double-caret-right",
},
},
left: {
orientation: "left",
icon: {
collapsed: "double-caret-right",
opened: "double-caret-left",
},
},
};
export class PanelComponent {
static { this.ANIMATION_TIME = 300; }
static { this.RESIZE_DIRECTIVE_WIDTH = "8px"; }
static { this.SIZE_VALUES = {
width: {
COLLAPSED_VALUE: "40px",
MIN_VALUE: "150px",
DEFAULT_VALUE: "250px",
MAX_VALUE: "90%",
},
height: {
COLLAPSED_VALUE: "40px",
MIN_VALUE: "40px",
DEFAULT_VALUE: "120px",
MAX_VALUE: "90%",
},
}; }
/**
* Set this to true in order to set the collapsed state of the side pane
*/
set isCollapsed(value) {
// used to catch first ngOnChanges
if (!isUndefined(this._isCollapsed)) {
this.defineIsCollapsed(value);
}
else {
this._isCollapsed = false;
}
}
get isCollapsed() {
return this._isCollapsed;
}
/**
* Set this to true in order to hide the side pane. This may be useful if you want to use nui-panel but want to
* show the left pane conditionally.
*/
set isHidden(value) {
if (this.isClosable && this._isHidden !== value) {
this.toggleHideOrCollapsed();
}
}
get isHidden() {
return this._isHidden;
}
constructor(renderer, builder, changeDetectorRef) {
this.renderer = renderer;
this.builder = builder;
this.changeDetectorRef = changeDetectorRef;
/**
* Use this attribute to set the mode of the panel, by default is set to 'static',
* collapsible mode allows panel to be opened or collapsed, 'hoverable' mode make panel displayed with the hover,
* 'closable' allows to close panel by click.
*/
this.panelMode = PanelModes.static;
/**
* Show sidebar over content if displacePrimaryContent = false, show sidebar near content if displacePrimaryContent = true
*/
this.displacePrimaryContent = true;
/**
* Define orientation of a panel. Possible values are: "right", "left", "top", "bottom"
*/
this.orientation = "left";
/**
* Use this attribute to make side pane resizable.
*/
this.isResizable = false;
/**
* Use this attribute to remove default padding from header.
*/
this.headerPadding = true;
/**
* Use this attribute to remove default padding from side pane body.
*/
this.sidePaneBodyPadding = true;
/**
* Use this attribute to set pane right border dark color.
*/
this.darkBorder = false;
this.panelBackgroundColor = PanelBackgroundColor.colorBgLight;
this.collapsed = new EventEmitter();
this.hidden = new EventEmitter();
this.displayFooter = true;
this.displayPanelHeader = true;
this.isCollapsible = false;
this.isClosable = false;
this.isHoverable = false;
this.isAnimating = false;
this._isHidden = false;
this.toggles = new Subject();
}
ngOnInit() {
this.defineSizes();
this.defineState();
this.togglesSubscription = this.toggles
.pipe(filter((toggle) => toggle === this._isCollapsed))
.pipe(distinctUntilChanged())
.pipe(debounceTime(PanelComponent.ANIMATION_TIME))
.subscribe((_) => this.toggleHideOrCollapsed());
}
ngOnChanges(changes) {
if (changes["panelMode"] && changes["panelMode"].isFirstChange()) {
this.defineSizes();
}
this.updatePaneContainerSizeWithoutAnimation();
if (changes["panelMode"]) {
this.defineState();
}
if (changes["isCollapsed"] && changes["isCollapsed"].isFirstChange()) {
this.isCollapsed = changes.isCollapsed.currentValue;
}
if (changes["isHidden"] && changes["isHidden"].isFirstChange()) {
this.isHidden = changes.isHidden.currentValue;
}
}
ngAfterViewInit() {
if (this.orientation === panelMap.bottom.orientation) {
this.isResizable = false;
}
this.displayFooter = !this.paneDirectionHorizontal;
this.checkPanelEmbeddedContent();
this.handleContentMargin();
this.updatePaneContainerSizeWithoutAnimation();
}
ngOnDestroy() {
this.destroyLastAnimationPlayer();
this.destroyAnimationFactories();
if (this.togglesSubscription) {
this.togglesSubscription.unsubscribe();
}
}
onSizeChanged(newSize) {
this.paneSize = newSize;
}
get panelClass() {
return panelMap[this.orientation].class;
}
get paneDirectionHorizontal() {
return (this.orientation === panelMap.top.orientation ||
this.orientation === panelMap.bottom.orientation);
}
get mainIcon() {
return panelMap[this.orientation].icon[this.panelState];
}
toggleEnter() {
if (this.isHoverable) {
this.toggles.next(true);
}
}
toggleLeave() {
if (this.isHoverable) {
this.toggles.next(false);
}
}
isPanelResizable() {
return this.isResizable && !this.isCollapsed;
}
toggleHideOrCollapsed() {
if (this.isClosable) {
this._isHidden = !this._isHidden;
this.hidden.emit(this._isHidden);
}
else {
this.toggleCollapsed();
}
}
toggleCollapsed() {
const animationFactory = this._isCollapsed
? this.expandAnimationFactory
: this.collapseAnimationFactory;
const sizeValue = this._isCollapsed
? this.paneSize
: this.paneCollapsedSize;
const animationPlayer = animationFactory.create(this.getPaneContainerElement());
animationPlayer.play();
this.isAnimating = true;
animationPlayer.onDone(() => {
this.lastAnimationPlayer = animationPlayer;
this.renderer.setStyle(this.getPaneContainerElement(), this.sizeParameter, sizeValue);
this.destroyLastAnimationPlayer();
this._isCollapsed = !this._isCollapsed;
this.collapsed.emit(this._isCollapsed);
this.isAnimating = false;
if (this.isResizable) {
this.isCollapsed
? this.removeMinSize()
: this.applyBoundarySizes();
}
this.changeDetectorRef.detectChanges();
});
}
defineIsCollapsed(isCollapsedToBecome) {
if (this._isCollapsed !== isCollapsedToBecome) {
this.toggleCollapsed();
}
}
getResizeDirection() {
switch (this.orientation) {
case "left":
return "right";
case "right":
return "left";
case "top":
return "bottom";
case "bottom":
return "top";
default: {
return undefined;
}
}
}
getPaneSizeMeasurement() {
return this.paneSize.indexOf("%") !== -1 ? "%" : "px";
}
get paneBodyWidth() {
return !this.paneDirectionHorizontal ? this.paneSize : "auto";
}
get paneBodyHeight() {
return this.paneDirectionHorizontal ? this.paneSize : "auto";
}
handleContentMargin() {
if (!this.displacePrimaryContent && !this.isClosable) {
this.renderer.setStyle(this.getPanelMainContentElement(), "margin-" + this.orientation, this.paneCollapsedSize);
}
}
applyBoundarySizes() {
if (this.isResizable) {
this.renderer.setStyle(this.getPaneContainerElement(), "min-" + this.sizeParameter, this.paneMinSize);
this.renderer.setStyle(this.getPaneContainerElement(), "max-" + this.sizeParameter, this.paneMaxSize);
}
}
removeMinSize() {
if (this.isResizable) {
this.renderer.setStyle(this.getPaneContainerElement(), "min-" + this.sizeParameter, "0");
}
}
toggleCollapsedOnClick() {
if (!this.isHoverable) {
this.toggleHideOrCollapsed();
}
}
get sizeParameter() {
return this.paneDirectionHorizontal
? SizeParameters.height
: SizeParameters.width;
}
get showDefaultIcon() {
return (this.isClosable || this.isCollapsible) && !this.isHoverable;
}
defineState() {
this.isCollapsible = this.panelMode === PanelModes.collapsible;
this.isClosable = this.panelMode === PanelModes.closable;
this.isHoverable = this.panelMode === PanelModes.hoverable;
if (this.isHoverable) {
this._isCollapsed = true;
this.isCollapsible = true;
}
}
defineSizes() {
this.paneSize =
this.paneSize ||
PanelComponent.SIZE_VALUES[this.sizeParameter].DEFAULT_VALUE;
this.paneCollapsedSize = !this.paneCollapsedSize
? PanelComponent.SIZE_VALUES[this.sizeParameter].COLLAPSED_VALUE
: this.paneCollapsedSize;
this.paneMinSize = !this.paneMinSize
? PanelComponent.SIZE_VALUES[this.sizeParameter].MIN_VALUE
: this.paneMinSize;
this.paneMaxSize = !this.paneMaxSize
? PanelComponent.SIZE_VALUES[this.sizeParameter].MAX_VALUE
: this.paneMaxSize;
}
get panelState() {
return this._isCollapsed ? PanelStates.collapsed : PanelStates.opened;
}
checkPanelEmbeddedContent() {
this.displayPanelHeader =
this.headerContent.element.nativeElement.children.length !== 0;
this.changeDetectorRef.detectChanges();
}
updatePaneContainerSizeWithoutAnimation() {
// Manually update width of left pane container only if it is expanded.
if ((!this.isCollapsible || !this._isCollapsed) &&
this.sidePaneContainer) {
this.applyBoundarySizes();
this.destroyLastAnimationPlayer();
this.renderer.setStyle(this.getPaneContainerElement(), this.sizeParameter, this.paneSize);
}
else if (this._isCollapsed) {
this.removeMinSize();
this.destroyLastAnimationPlayer();
this.renderer.setStyle(this.getPaneContainerElement(), this.sizeParameter, this.paneCollapsedSize);
}
}
getPaneContainerElement() {
return this.sidePaneContainer.element.nativeElement;
}
getPanelMainContentElement() {
return this.panelMainContent.element.nativeElement;
}
get expandAnimationFactory() {
if (!this._expandAnimationFactory || this.isResizable) {
this._expandAnimationFactory = this.buildAnimationFactory(this.paneCollapsedSize, this.paneSize);
}
return this._expandAnimationFactory;
}
get collapseAnimationFactory() {
this.removeMinSize();
if (!this._collapseAnimationFactory || this.isResizable) {
this._collapseAnimationFactory = this.buildAnimationFactory(this.paneSize, this.paneCollapsedSize);
}
return this._collapseAnimationFactory;
}
buildAnimationFactory(startSize, endSize) {
if (this.paneDirectionHorizontal) {
return this.builder.build([
style({
height: startSize,
}),
animate(`${PanelComponent.ANIMATION_TIME}ms ease-in-out`, style({ height: endSize })),
]);
}
return this.builder.build([
style({
width: startSize,
}),
animate(`${PanelComponent.ANIMATION_TIME}ms ease-in-out`, style({ width: endSize })),
]);
}
destroyLastAnimationPlayer() {
if (this.lastAnimationPlayer) {
this.lastAnimationPlayer.destroy();
delete this.lastAnimationPlayer;
}
}
destroyAnimationFactories() {
delete this._expandAnimationFactory;
delete this._collapseAnimationFactory;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelComponent, deps: [{ token: i0.Renderer2 }, { token: i1.AnimationBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PanelComponent, selector: "nui-panel", inputs: { panelMode: "panelMode", heading: "heading", isCollapsed: "isCollapsed", displacePrimaryContent: "displacePrimaryContent", isHidden: "isHidden", orientation: "orientation", isResizable: "isResizable", headerPadding: "headerPadding", sidePaneBodyPadding: "sidePaneBodyPadding", darkBorder: "darkBorder", paneSize: "paneSize", panelBackgroundColor: "panelBackgroundColor", paneCollapsedSize: "paneCollapsedSize", paneMinSize: "paneMinSize", paneMaxSize: "paneMaxSize" }, outputs: { collapsed: "collapsed", hidden: "hidden" }, viewQueries: [{ propertyName: "panelMainContent", first: true, predicate: ["mainContent"], descendants: true, read: ViewContainerRef }, { propertyName: "headerContent", first: true, predicate: ["headerContent"], descendants: true, read: ViewContainerRef }, { propertyName: "footerContent", first: true, predicate: ["footerContent"], descendants: true, read: ViewContainerRef }, { propertyName: "sidePaneContainer", first: true, predicate: ["sidePaneContainer"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"nui-panel media nui-panel--{{ orientation }}\"\n [class.nui-panel--hoverable]=\"isHoverable\"\n [class.nui-panel--is-collapsed]=\"isCollapsible && isCollapsed\"\n [class.nui-panel--animating]=\"isAnimating\"\n role=\"tabpanel\"\n [attr.aria-expanded]=\"!isCollapsible || !isCollapsed\"\n [attr.aria-hidden]=\"isCollapsible && isCollapsed\"\n>\n <div\n class=\"nui-panel__side-pane\"\n [ngClass]=\"panelBackgroundColor\"\n [class.nui-panel-pane--border-dark]=\"darkBorder\"\n [class.nui-panel-pane__hidden]=\"isHidden\"\n [class.nui-panel-pane__closable]=\"isClosable\"\n [class.nui-panel--shrink]=\"displacePrimaryContent\"\n [class.nui-panel-pane__vertical]=\"paneDirectionHorizontal\"\n (mouseenter)=\"toggleEnter()\"\n (mouseleave)=\"toggleLeave()\"\n nuiResizer\n [resizerDirection]=\"getResizeDirection()\"\n [resizerDisabled]=\"!isPanelResizable()\"\n [resizerValue]=\"getPaneSizeMeasurement()\"\n (resizerSizeChanged)=\"onSizeChanged($event)\"\n #sidePaneContainer\n >\n <div class=\"nui-panel__container\" #paneContainer>\n <div\n *ngIf=\"displayPanelHeader\"\n class=\"nui-panel__header\"\n [class.nui-panel__header--no-padding]=\"!headerPadding\"\n #headerContent\n >\n <ng-content select=\"[nuiPanelEmbeddedIcon]\"></ng-content>\n <ng-container *ngIf=\"!heading; else defaultTitle\">\n <ng-content select=\"[nuiPanelEmbeddedHeading]\"></ng-content>\n </ng-container>\n\n <div\n *ngIf=\"showDefaultIcon\"\n class=\"nui-panel__header-container nui-panel__header-container--default\"\n >\n <ng-container *ngIf=\"!isClosable\">\n <button\n nui-button\n class=\"nui-panel__header-btn\"\n type=\"button\"\n displayStyle=\"action\"\n [icon]=\"mainIcon\"\n [disabled]=\"isAnimating\"\n (click)=\"toggleCollapsedOnClick()\"\n *ngIf=\"isCollapsible\"\n ></button>\n </ng-container>\n <ng-container *ngIf=\"isClosable\">\n <button\n nui-button\n displayStyle=\"action\"\n class=\"nui-panel__header-btn nui-panel__header-btn--close\"\n type=\"button\"\n icon=\"close\"\n (click)=\"toggleCollapsedOnClick()\"\n ></button>\n </ng-container>\n </div>\n </div>\n <div class=\"nui-panel__side-pane-body-wrapper nui-scroll-shadows\">\n <div\n *ngIf=\"!isCollapsed\"\n class=\"nui-panel__side-pane-body\"\n [class.nui-panel__side-pane-body--no-padding]=\"\n !sidePaneBodyPadding\n \"\n [style.min-width]=\"paneBodyWidth\"\n >\n <ng-content select=\"[nuiPanelEmbeddedBody]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"displayFooter\" class=\"nui-panel__footer\" #footerContent>\n <ng-content select=\"[nuiPanelEmbeddedFooter]\"></ng-content>\n </div>\n </div>\n </div>\n <div class=\"nui-panel__center-pane media-body\" #mainContent>\n <div class=\"nui-panel__container\">\n <div class=\"nui-panel__body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultTitle>\n <div class=\"nui-panel__header-content\">\n <span class=\"nui-panel__header-content-default\">\n <h4 class=\"nui-panel__header-default-title\">{{ heading }}</h4>\n </span>\n </div>\n</ng-template>\n", styles: [".nui .nui-panel{height:100%;width:100%;overflow:visible;position:relative;display:flex;margin-top:15px}.nui .nui-panel:first-child{margin-top:0}.nui .nui-panel--top,.nui .nui-panel--bottom{flex-direction:column}.nui .nui-panel__header{display:flex;position:relative;align-items:center;flex-shrink:0;min-height:40px;padding:var(--nui-space-xs,5px)}.nui .nui-panel__header--no-padding{padding:0}.nui .nui-panel__header-container{margin-left:auto}.nui .nui-panel__header-content{white-space:nowrap;text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;display:flex;align-items:center}.nui .nui-panel__header-default-title{line-height:26px;margin:0}.nui .nui-panel__header-btn{border:none;background-color:transparent}.nui .nui-panel__header-btn__right{float:left;border:none;background-color:transparent}.nui .nui-panel__container{display:flex;flex-direction:column;width:100%}.nui .nui-panel__container .nui-panel__body{width:100%}.nui .nui-panel__side-pane{--nui-color-bg-panel-side-pane: var(--nui-color-bg-content);--nui-color-bg-scroll: var(--nui-color-bg-content);background-color:var(--nui-color-bg-panel-side-pane);display:flex;height:100%;flex-shrink:0;z-index:var(--nui-panel-side-pane-stack-order,100);position:absolute;top:0}.nui .nui-panel__side-pane.color-bg-secondary{--nui-color-bg-panel-side-pane: var(--nui-color-bg-secondary);--nui-color-bg-scroll: var(--nui-color-bg-secondary)}.nui .nui-panel__side-pane.color-bg-transparent{--nui-color-bg-panel-side-pane: var(--nui-color-bg-transparent)}.nui .nui-panel__side-pane.nui-panel-pane__hidden{display:none}.nui .nui-panel__side-pane.nui-panel-pane__vertical{flex-direction:column}.nui .nui-panel__side-pane.nui-panel--shrink{position:static}.nui .nui-panel__side-pane .nui-panel__side-pane-body{position:relative;height:100%;padding:0 5px}.nui .nui-panel__side-pane .nui-panel__side-pane-body--no-padding{padding:0}.nui .nui-panel__side-pane .nui-panel__side-pane-body-wrapper{height:100%;overflow-y:auto;overflow-x:hidden}.nui .nui-panel__center-pane{width:100%;overflow-y:auto}.nui .nui-panel [nuiPanelEmbeddedFooter]{border-top:1px solid #d9d9d9;border-top:solid 1px var(--nui-color-line-default, #d9d9d9);padding:10px 15px}.nui .nui-panel.nui-panel--animating .nui-panel__side-pane{overflow:hidden}.nui .nui-panel.nui-panel--animating.nui-panel--left [nuiPanelEmbeddedIcon],.nui .nui-panel.nui-panel--animating.nui-panel--right [nuiPanelEmbeddedIcon]{transform:scale(0)}.nui .nui-panel.nui-panel--is-collapsed>.nui-panel__side-pane .nui-panel__side-pane-body-wrapper{opacity:0;pointer-events:none}.nui .nui-panel.nui-panel--is-collapsed .nui-panel__header{padding:var(--nui-space-xs,5px)}.nui .nui-panel.nui-panel--is-collapsed .nui-panel__header-btn--close{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header{flex-direction:column}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header-content-default,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header-content-default{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header [nuiPanelEmbeddedHeading],.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header [nuiPanelEmbeddedHeading]{transform:scale(0)}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header-container--default,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header-container--default{order:-1}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__footer,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__footer{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right .nui-panel__header-container--default{margin-right:auto}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--top .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--bottom .nui-panel__side-pane-body{position:static}.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel--shrink,.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel--shrink,.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel--shrink .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel--shrink .nui-panel__side-pane-body{height:auto}.nui .nui-panel.nui-panel--left .nui-panel__side-pane{padding-right:0;left:0;border-right:1px solid;border-right-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel-pane--border-dark{border-right:1px solid;border-right-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--right .nui-panel__side-pane{order:2;right:0;padding-left:0;border-left:1px solid;border-left-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel-pane--border-dark{border-left:1px solid;border-left-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--right .nui-panel__header-container--default{order:-1;margin-left:0}.nui .nui-panel.nui-panel--right .nui-panel-pane__closable .nui-panel__header{flex-direction:row-reverse}.nui .nui-panel.nui-panel--right .nui-panel-pane__closable .nui-panel__header-container--default{margin-left:auto}.nui .nui-panel.nui-panel--top .nui-panel__side-pane,.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane{width:100%;left:0}.nui .nui-panel.nui-panel--top .nui-panel__side-pane .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane .nui-panel__side-pane-body{overflow-y:auto}.nui .nui-panel.nui-panel--top .nui-panel__header-container--default,.nui .nui-panel.nui-panel--bottom .nui-panel__header-container--default{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);order:1;margin-right:auto}.nui .nui-panel.nui-panel--top .nui-panel-pane__closable .nui-panel__header-container--default,.nui .nui-panel.nui-panel--bottom .nui-panel-pane__closable .nui-panel__header-container--default{position:static;transform:none;margin-right:0}.nui .nui-panel.nui-panel--top .nui-panel__side-pane{border-bottom:1px solid;border-bottom-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--top .nui-panel__side-pane.nui-panel-pane--border-dark{border-bottom:1px solid;border-bottom-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane{order:2;bottom:0;top:auto;border-top:1px solid;border-top-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane.nui-panel-pane--border-dark{border-top:1px solid;border-top-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--hoverable .nui-panel__side-pane{transition:box-shadow 0s .3s}.nui .nui-panel.nui-panel--hoverable .nui-panel__side-pane:hover{transition:box-shadow 0s}.nui .nui-panel.nui-panel--hoverable.nui-panel--left .nui-panel__side-pane:hover{box-shadow:6px 0 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--right .nui-panel__side-pane:hover{box-shadow:-6px 0 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--top .nui-panel__side-pane:hover{box-shadow:0 6px 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--bottom .nui-panel__side-pane:hover{box-shadow:0 -6px 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ResizerDirective, selector: "[nuiResizer]", inputs: ["resizerDirection", "resizerDisabled", "resizerValue", "isMultiple"], outputs: ["resizerSizeChanged"] }, { kind: "component", type: i4.ButtonComponent, selector: "[nui-button]", inputs: ["displayStyle", "icon", "iconColor", "iconRight", "isBusy", "isEmpty", "ariaLabel", "isRepeat", "size"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelComponent, decorators: [{
type: Component,
args: [{ selector: "nui-panel", encapsulation: ViewEncapsulation.None, template: "<div\n class=\"nui-panel media nui-panel--{{ orientation }}\"\n [class.nui-panel--hoverable]=\"isHoverable\"\n [class.nui-panel--is-collapsed]=\"isCollapsible && isCollapsed\"\n [class.nui-panel--animating]=\"isAnimating\"\n role=\"tabpanel\"\n [attr.aria-expanded]=\"!isCollapsible || !isCollapsed\"\n [attr.aria-hidden]=\"isCollapsible && isCollapsed\"\n>\n <div\n class=\"nui-panel__side-pane\"\n [ngClass]=\"panelBackgroundColor\"\n [class.nui-panel-pane--border-dark]=\"darkBorder\"\n [class.nui-panel-pane__hidden]=\"isHidden\"\n [class.nui-panel-pane__closable]=\"isClosable\"\n [class.nui-panel--shrink]=\"displacePrimaryContent\"\n [class.nui-panel-pane__vertical]=\"paneDirectionHorizontal\"\n (mouseenter)=\"toggleEnter()\"\n (mouseleave)=\"toggleLeave()\"\n nuiResizer\n [resizerDirection]=\"getResizeDirection()\"\n [resizerDisabled]=\"!isPanelResizable()\"\n [resizerValue]=\"getPaneSizeMeasurement()\"\n (resizerSizeChanged)=\"onSizeChanged($event)\"\n #sidePaneContainer\n >\n <div class=\"nui-panel__container\" #paneContainer>\n <div\n *ngIf=\"displayPanelHeader\"\n class=\"nui-panel__header\"\n [class.nui-panel__header--no-padding]=\"!headerPadding\"\n #headerContent\n >\n <ng-content select=\"[nuiPanelEmbeddedIcon]\"></ng-content>\n <ng-container *ngIf=\"!heading; else defaultTitle\">\n <ng-content select=\"[nuiPanelEmbeddedHeading]\"></ng-content>\n </ng-container>\n\n <div\n *ngIf=\"showDefaultIcon\"\n class=\"nui-panel__header-container nui-panel__header-container--default\"\n >\n <ng-container *ngIf=\"!isClosable\">\n <button\n nui-button\n class=\"nui-panel__header-btn\"\n type=\"button\"\n displayStyle=\"action\"\n [icon]=\"mainIcon\"\n [disabled]=\"isAnimating\"\n (click)=\"toggleCollapsedOnClick()\"\n *ngIf=\"isCollapsible\"\n ></button>\n </ng-container>\n <ng-container *ngIf=\"isClosable\">\n <button\n nui-button\n displayStyle=\"action\"\n class=\"nui-panel__header-btn nui-panel__header-btn--close\"\n type=\"button\"\n icon=\"close\"\n (click)=\"toggleCollapsedOnClick()\"\n ></button>\n </ng-container>\n </div>\n </div>\n <div class=\"nui-panel__side-pane-body-wrapper nui-scroll-shadows\">\n <div\n *ngIf=\"!isCollapsed\"\n class=\"nui-panel__side-pane-body\"\n [class.nui-panel__side-pane-body--no-padding]=\"\n !sidePaneBodyPadding\n \"\n [style.min-width]=\"paneBodyWidth\"\n >\n <ng-content select=\"[nuiPanelEmbeddedBody]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"displayFooter\" class=\"nui-panel__footer\" #footerContent>\n <ng-content select=\"[nuiPanelEmbeddedFooter]\"></ng-content>\n </div>\n </div>\n </div>\n <div class=\"nui-panel__center-pane media-body\" #mainContent>\n <div class=\"nui-panel__container\">\n <div class=\"nui-panel__body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultTitle>\n <div class=\"nui-panel__header-content\">\n <span class=\"nui-panel__header-content-default\">\n <h4 class=\"nui-panel__header-default-title\">{{ heading }}</h4>\n </span>\n </div>\n</ng-template>\n", styles: [".nui .nui-panel{height:100%;width:100%;overflow:visible;position:relative;display:flex;margin-top:15px}.nui .nui-panel:first-child{margin-top:0}.nui .nui-panel--top,.nui .nui-panel--bottom{flex-direction:column}.nui .nui-panel__header{display:flex;position:relative;align-items:center;flex-shrink:0;min-height:40px;padding:var(--nui-space-xs,5px)}.nui .nui-panel__header--no-padding{padding:0}.nui .nui-panel__header-container{margin-left:auto}.nui .nui-panel__header-content{white-space:nowrap;text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;display:flex;align-items:center}.nui .nui-panel__header-default-title{line-height:26px;margin:0}.nui .nui-panel__header-btn{border:none;background-color:transparent}.nui .nui-panel__header-btn__right{float:left;border:none;background-color:transparent}.nui .nui-panel__container{display:flex;flex-direction:column;width:100%}.nui .nui-panel__container .nui-panel__body{width:100%}.nui .nui-panel__side-pane{--nui-color-bg-panel-side-pane: var(--nui-color-bg-content);--nui-color-bg-scroll: var(--nui-color-bg-content);background-color:var(--nui-color-bg-panel-side-pane);display:flex;height:100%;flex-shrink:0;z-index:var(--nui-panel-side-pane-stack-order,100);position:absolute;top:0}.nui .nui-panel__side-pane.color-bg-secondary{--nui-color-bg-panel-side-pane: var(--nui-color-bg-secondary);--nui-color-bg-scroll: var(--nui-color-bg-secondary)}.nui .nui-panel__side-pane.color-bg-transparent{--nui-color-bg-panel-side-pane: var(--nui-color-bg-transparent)}.nui .nui-panel__side-pane.nui-panel-pane__hidden{display:none}.nui .nui-panel__side-pane.nui-panel-pane__vertical{flex-direction:column}.nui .nui-panel__side-pane.nui-panel--shrink{position:static}.nui .nui-panel__side-pane .nui-panel__side-pane-body{position:relative;height:100%;padding:0 5px}.nui .nui-panel__side-pane .nui-panel__side-pane-body--no-padding{padding:0}.nui .nui-panel__side-pane .nui-panel__side-pane-body-wrapper{height:100%;overflow-y:auto;overflow-x:hidden}.nui .nui-panel__center-pane{width:100%;overflow-y:auto}.nui .nui-panel [nuiPanelEmbeddedFooter]{border-top:1px solid #d9d9d9;border-top:solid 1px var(--nui-color-line-default, #d9d9d9);padding:10px 15px}.nui .nui-panel.nui-panel--animating .nui-panel__side-pane{overflow:hidden}.nui .nui-panel.nui-panel--animating.nui-panel--left [nuiPanelEmbeddedIcon],.nui .nui-panel.nui-panel--animating.nui-panel--right [nuiPanelEmbeddedIcon]{transform:scale(0)}.nui .nui-panel.nui-panel--is-collapsed>.nui-panel__side-pane .nui-panel__side-pane-body-wrapper{opacity:0;pointer-events:none}.nui .nui-panel.nui-panel--is-collapsed .nui-panel__header{padding:var(--nui-space-xs,5px)}.nui .nui-panel.nui-panel--is-collapsed .nui-panel__header-btn--close{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header{flex-direction:column}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header-content-default,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header-content-default{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header [nuiPanelEmbeddedHeading],.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header [nuiPanelEmbeddedHeading]{transform:scale(0)}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__header-container--default,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__header-container--default{order:-1}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right>.nui-panel__side-pane .nui-panel__footer,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--left>.nui-panel__side-pane .nui-panel__footer{display:none}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--right .nui-panel__header-container--default{margin-right:auto}.nui .nui-panel.nui-panel--is-collapsed.nui-panel--top .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--is-collapsed.nui-panel--bottom .nui-panel__side-pane-body{position:static}.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel--shrink,.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel--shrink,.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel--shrink .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel--shrink .nui-panel__side-pane-body{height:auto}.nui .nui-panel.nui-panel--left .nui-panel__side-pane{padding-right:0;left:0;border-right:1px solid;border-right-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--left .nui-panel__side-pane.nui-panel-pane--border-dark{border-right:1px solid;border-right-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--right .nui-panel__side-pane{order:2;right:0;padding-left:0;border-left:1px solid;border-left-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--right .nui-panel__side-pane.nui-panel-pane--border-dark{border-left:1px solid;border-left-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--right .nui-panel__header-container--default{order:-1;margin-left:0}.nui .nui-panel.nui-panel--right .nui-panel-pane__closable .nui-panel__header{flex-direction:row-reverse}.nui .nui-panel.nui-panel--right .nui-panel-pane__closable .nui-panel__header-container--default{margin-left:auto}.nui .nui-panel.nui-panel--top .nui-panel__side-pane,.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane{width:100%;left:0}.nui .nui-panel.nui-panel--top .nui-panel__side-pane .nui-panel__side-pane-body,.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane .nui-panel__side-pane-body{overflow-y:auto}.nui .nui-panel.nui-panel--top .nui-panel__header-container--default,.nui .nui-panel.nui-panel--bottom .nui-panel__header-container--default{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);order:1;margin-right:auto}.nui .nui-panel.nui-panel--top .nui-panel-pane__closable .nui-panel__header-container--default,.nui .nui-panel.nui-panel--bottom .nui-panel-pane__closable .nui-panel__header-container--default{position:static;transform:none;margin-right:0}.nui .nui-panel.nui-panel--top .nui-panel__side-pane{border-bottom:1px solid;border-bottom-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--top .nui-panel__side-pane.nui-panel-pane--border-dark{border-bottom:1px solid;border-bottom-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane{order:2;bottom:0;top:auto;border-top:1px solid;border-top-color:var(--nui-color-line-default,#d9d9d9)}.nui .nui-panel.nui-panel--bottom .nui-panel__side-pane.nui-panel-pane--border-dark{border-top:1px solid;border-top-color:var(--nui-color-line-dark,#999999)}.nui .nui-panel.nui-panel--hoverable .nui-panel__side-pane{transition:box-shadow 0s .3s}.nui .nui-panel.nui-panel--hoverable .nui-panel__side-pane:hover{transition:box-shadow 0s}.nui .nui-panel.nui-panel--hoverable.nui-panel--left .nui-panel__side-pane:hover{box-shadow:6px 0 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--right .nui-panel__side-pane:hover{box-shadow:-6px 0 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--top .nui-panel__side-pane:hover{box-shadow:0 6px 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}.nui .nui-panel.nui-panel--hoverable.nui-panel--bottom .nui-panel__side-pane:hover{box-shadow:0 -6px 5px -5px var(--nui-shadow-color, rgba(17, 17, 17, .3))}\n"] }]
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.AnimationBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { panelMode: [{
type: Input
}], heading: [{
type: Input
}], isCollapsed: [{
type: Input
}], displacePrimaryContent: [{
type: Input
}], isHidden: [{
type: Input
}], orientation: [{
type: Input
}], isResizable: [{
type: Input
}], headerPadding: [{
type: Input
}], sidePaneBodyPadding: [{
type: Input
}], darkBorder: [{
type: Input
}], paneSize: [{
type: Input
}], panelBackgroundColor: [{
type: Input
}], paneCollapsedSize: [{
type: Input
}], paneMinSize: [{
type: Input
}], paneMaxSize: [{
type: Input
}], collapsed: [{
type: Output
}], hidden: [{
type: Output
}], panelMainContent: [{
type: ViewChild,
args: ["mainContent", { read: ViewContainerRef }]
}], headerContent: [{
type: ViewChild,
args: ["headerContent", { read: ViewContainerRef }]
}], footerContent: [{
type: ViewChild,
args: ["footerContent", { read: ViewContainerRef }]
}], sidePaneContainer: [{
type: ViewChild,
args: ["sidePaneContainer", { static: true, read: ViewContainerRef }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFuZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2xpYi9wYW5lbC9wYW5lbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9zcmMvbGliL3BhbmVsL3BhbmVsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlEQUF5RDtBQUN6RCxFQUFFO0FBQ0YsK0VBQStFO0FBQy9FLDRFQUE0RTtBQUM1RSw4RUFBOEU7QUFDOUUsK0VBQStFO0FBQy9FLDhFQUE4RTtBQUM5RSw0REFBNEQ7QUFDNUQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSx1REFBdUQ7QUFDdkQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSw0RUFBNEU7QUFDNUUsK0VBQStFO0FBQy9FLDBFQUEwRTtBQUMxRSxpRkFBaUY7QUFDakYsNkVBQTZFO0FBQzdFLGlCQUFpQjtBQUVqQixPQUFPLEVBQ0gsT0FBTyxFQUNQLGdCQUFnQixFQUdoQixLQUFLLEdBQ1IsTUFBTSxxQkFBcUIsQ0FBQztBQUM3QixPQUFPLEVBRUgsaUJBQWlCLEVBQ2pCLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUlMLE1BQU0sRUFDTixTQUFTLEVBRVQsU0FBUyxFQUNULGdCQUFnQixFQUNoQixpQkFBaUIsR0FDcEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxXQUFXLE1BQU0sb0JBQW9CLENBQUM7QUFDN0MsT0FBTyxFQUFFLE9BQU8sRUFBZ0IsTUFBTSxNQUFNLENBQUM7QUFDN0MsT0FBTyxFQUFFLFlBQVksRUFBRSxvQkFBb0IsRUFBRSxNQUFNLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUU1RSxPQUFPLEVBQ0gsb0JBQW9CLEVBQ3BCLFVBQVUsRUFDVixXQUFXLEVBQ1gsY0FBYyxHQUNqQixNQUFNLGNBQWMsQ0FBQzs7Ozs7O0FBRXRCLDZEQUE2RDtBQUU3RCxNQUFNLFFBQVEsR0FBUTtJQUNsQixHQUFHLEVBQUU7UUFDRCxXQUFX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