btv-base-controls 0.1.12 → 0.1.14
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/esm2020/lib/btv-search/btv-search.component.mjs +2 -2
- package/esm2020/lib/wm-panel-bar/wm-panel-bar.component.mjs +16 -4
- package/fesm2015/btv-base-controls.mjs +16 -4
- package/fesm2015/btv-base-controls.mjs.map +1 -1
- package/fesm2020/btv-base-controls.mjs +16 -4
- package/fesm2020/btv-base-controls.mjs.map +1 -1
- package/lib/wm-panel-bar/wm-panel-bar.component.d.ts +6 -2
- package/package.json +1 -1
|
@@ -57,10 +57,10 @@ export class BtvSearch {
|
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
59
|
BtvSearch.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvSearch, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
60
|
-
BtvSearch.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvSearch, selector: "btv-search", inputs: { widthAuto: "widthAuto", isSmall: "isSmall", searchRight: "searchRight", placeholder: "placeholder", keepExpanded: "keepExpanded", searchText: "searchText" }, outputs: { searchTextChange: "searchTextChange" }, viewQueries: [{ propertyName: "box", first: true, predicate: ["searchBox"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
60
|
+
BtvSearch.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvSearch, selector: "btv-search", inputs: { widthAuto: "widthAuto", isSmall: "isSmall", searchRight: "searchRight", placeholder: "placeholder", keepExpanded: "keepExpanded", searchText: "searchText" }, outputs: { searchTextChange: "searchTextChange" }, viewQueries: [{ propertyName: "box", first: true, predicate: ["searchBox"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.wm-search.small .search-open{width:auto}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
61
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvSearch, decorators: [{
|
|
62
62
|
type: Component,
|
|
63
|
-
args: [{ selector: 'btv-search', template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"] }]
|
|
63
|
+
args: [{ selector: 'btv-search', template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.wm-search.small .search-open{width:auto}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"] }]
|
|
64
64
|
}], ctorParameters: function () { return []; }, propDecorators: { widthAuto: [{
|
|
65
65
|
type: Input
|
|
66
66
|
}], isSmall: [{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, Input } from '@angular/core';
|
|
1
|
+
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
import * as i1 from "@angular/common";
|
|
4
4
|
import * as i2 from "../wm-tamplate-image/wm-template-image.component";
|
|
@@ -7,13 +7,22 @@ export class WmPanelBarComponent {
|
|
|
7
7
|
this.labelClasses = 'pb-label';
|
|
8
8
|
this.maxHeight = 'unset';
|
|
9
9
|
this.maxWidth = 'unset';
|
|
10
|
-
this.
|
|
10
|
+
this._open = false;
|
|
11
11
|
this.collapseText = 'Collapse';
|
|
12
12
|
this.expandText = 'Expand';
|
|
13
|
+
this.openChange = new EventEmitter();
|
|
13
14
|
this.directionBottom = true;
|
|
14
15
|
this.directionLeft = false;
|
|
15
16
|
this._direction = 'bottom';
|
|
16
17
|
}
|
|
18
|
+
set open(value) {
|
|
19
|
+
if (value === this._open)
|
|
20
|
+
return;
|
|
21
|
+
this._open = value;
|
|
22
|
+
}
|
|
23
|
+
get open() {
|
|
24
|
+
return this._open;
|
|
25
|
+
}
|
|
17
26
|
get direction() { return this._direction; }
|
|
18
27
|
set direction(val) {
|
|
19
28
|
if (val !== 'bottom' && val !== 'left') {
|
|
@@ -33,10 +42,11 @@ export class WmPanelBarComponent {
|
|
|
33
42
|
}
|
|
34
43
|
onClick() {
|
|
35
44
|
this.open = !this.open;
|
|
45
|
+
this.openChange.emit(this.open);
|
|
36
46
|
}
|
|
37
47
|
}
|
|
38
48
|
WmPanelBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WmPanelBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
39
|
-
WmPanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WmPanelBarComponent, selector: "wm-panel-bar", inputs: { label: "label", labelClasses: "labelClasses", openedLabel: "openedLabel", width: "width", height: "height", maxHeight: "maxHeight", maxWidth: "maxWidth", open: "open", collapseText: "collapseText", expandText: "expandText", direction: "direction" }, ngImport: i0, template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
49
|
+
WmPanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WmPanelBarComponent, selector: "wm-panel-bar", inputs: { label: "label", labelClasses: "labelClasses", openedLabel: "openedLabel", width: "width", height: "height", maxHeight: "maxHeight", maxWidth: "maxWidth", open: "open", collapseText: "collapseText", expandText: "expandText", direction: "direction" }, outputs: { openChange: "openChange" }, ngImport: i0, template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
40
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WmPanelBarComponent, decorators: [{
|
|
41
51
|
type: Component,
|
|
42
52
|
args: [{ selector: 'wm-panel-bar', template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"] }]
|
|
@@ -60,7 +70,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImpor
|
|
|
60
70
|
type: Input
|
|
61
71
|
}], expandText: [{
|
|
62
72
|
type: Input
|
|
73
|
+
}], openChange: [{
|
|
74
|
+
type: Output
|
|
63
75
|
}], direction: [{
|
|
64
76
|
type: Input
|
|
65
77
|
}] } });
|
|
66
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
78
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid20tcGFuZWwtYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2J0di1iYXNlLWNvbnRyb2xzL3NyYy9saWIvd20tcGFuZWwtYmFyL3dtLXBhbmVsLWJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9idHYtYmFzZS1jb250cm9scy9zcmMvbGliL3dtLXBhbmVsLWJhci93bS1wYW5lbC1iYXIuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBT3ZFLE1BQU0sT0FBTyxtQkFBbUI7SUFMaEM7UUFPVyxpQkFBWSxHQUErQixVQUFVLENBQUM7UUFLdEQsY0FBUyxHQUFXLE9BQU8sQ0FBQztRQUM1QixhQUFRLEdBQVcsT0FBTyxDQUFDO1FBRzVCLFVBQUssR0FBVyxLQUFLLENBQUM7UUFVckIsaUJBQVksR0FBVyxVQUFVLENBQUM7UUFDbEMsZUFBVSxHQUFXLFFBQVEsQ0FBQztRQUM3QixlQUFVLEdBQTBCLElBQUksWUFBWSxFQUFXLENBQUM7UUFDMUUsb0JBQWUsR0FBWSxJQUFJLENBQUM7UUFDaEMsa0JBQWEsR0FBWSxLQUFLLENBQUM7UUFFdkIsZUFBVSxHQUFzQixRQUFRLENBQUM7S0F3QmxEO0lBdENDLElBQWEsSUFBSSxDQUFDLEtBQWM7UUFDOUIsSUFBSSxLQUFLLEtBQUssSUFBSSxDQUFDLEtBQUs7WUFBRSxPQUFPO1FBQ2pDLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO0lBQ3JCLENBQUM7SUFFRCxJQUFJLElBQUk7UUFDTixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDcEIsQ0FBQztJQVFELElBQUksU0FBUyxLQUFLLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUM7SUFDM0MsSUFBYSxTQUFTLENBQUMsR0FBRztRQUN4QixJQUFJLEdBQUcsS0FBSyxRQUFRLElBQUksR0FBRyxLQUFLLE1BQU0sRUFBRTtZQUN0QyxHQUFHLEdBQUcsUUFBUSxDQUFDO1NBQ2hCO1FBQ0QsSUFBSSxDQUFDLFVBQVUsR0FBRyxHQUFHLENBQUM7UUFDdEIsUUFBUSxHQUFHLEVBQUU7WUFDWCxLQUFLLE1BQU07Z0JBQ1QsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7Z0JBQzFCLElBQUksQ0FBQyxlQUFlLEdBQUcsS0FBSyxDQUFDO2dCQUM3QixNQUFNO1lBQ1I7Z0JBQ0UsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUM7Z0JBQzVCLElBQUksQ0FBQyxhQUFhLEdBQUcsS0FBSyxDQUFDO2dCQUMzQixNQUFNO1NBQ1Q7SUFDSCxDQUFDO0lBR0QsT0FBTztRQUNMLElBQUksQ0FBQyxJQUFJLEdBQUcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUNsQyxDQUFDOztnSEFsRFUsbUJBQW1CO29HQUFuQixtQkFBbUIsK1ZDUGhDLHUxREFvQ2M7MkZEN0JELG1CQUFtQjtrQkFML0IsU0FBUzsrQkFDRSxjQUFjOzhCQUtmLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBRUcsS0FBSztzQkFBYixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBS08sSUFBSTtzQkFBaEIsS0FBSztnQkFRRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0ksVUFBVTtzQkFBbkIsTUFBTTtnQkFNTSxTQUFTO3NCQUFyQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnd20tcGFuZWwtYmFyJyxcclxuICBzdHlsZVVybHM6IFsnd20tcGFuZWwtYmFyLnNjc3MnXSxcclxuICB0ZW1wbGF0ZVVybDogJy4vd20tcGFuZWwtYmFyLmh0bWwnXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBXbVBhbmVsQmFyQ29tcG9uZW50IHtcclxuICBASW5wdXQoKSBsYWJlbDogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGxhYmVsQ2xhc3NlczogJ3BiLWxhYmVsJyB8ICdicmFuZC1sYWJlbCcgPSAncGItbGFiZWwnO1xyXG4gIEBJbnB1dCgpIG9wZW5lZExhYmVsOiBzdHJpbmc7XHJcblxyXG4gIEBJbnB1dCgpIHdpZHRoOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgaGVpZ2h0OiBzdHJpbmc7XHJcbiAgQElucHV0KCkgbWF4SGVpZ2h0OiBzdHJpbmcgPSAndW5zZXQnO1xyXG4gIEBJbnB1dCgpIG1heFdpZHRoOiBzdHJpbmcgPSAndW5zZXQnO1xyXG5cclxuICBcclxuICBwcml2YXRlIF9vcGVuOiBib29sZWFuPSBmYWxzZTtcclxuXHJcbiAgQElucHV0KCkgc2V0IG9wZW4odmFsdWU6IGJvb2xlYW4pIHtcclxuICAgIGlmICh2YWx1ZSA9PT0gdGhpcy5fb3BlbikgcmV0dXJuO1xyXG4gICAgdGhpcy5fb3BlbiA9IHZhbHVlO1xyXG4gIH1cclxuXHJcbiAgZ2V0IG9wZW4oKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5fb3BlbjtcclxuICB9XHJcbiAgQElucHV0KCkgY29sbGFwc2VUZXh0OiBzdHJpbmcgPSAnQ29sbGFwc2UnO1xyXG4gIEBJbnB1dCgpIGV4cGFuZFRleHQ6IHN0cmluZyA9ICdFeHBhbmQnO1xyXG4gIEBPdXRwdXQoKSBvcGVuQ2hhbmdlOiBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4gPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XHJcbiAgZGlyZWN0aW9uQm90dG9tOiBib29sZWFuID0gdHJ1ZTtcclxuICBkaXJlY3Rpb25MZWZ0OiBib29sZWFuID0gZmFsc2U7XHJcblxyXG4gIHByaXZhdGUgX2RpcmVjdGlvbjogJ2JvdHRvbScgfCAnbGVmdCcgPSAnYm90dG9tJztcclxuICBnZXQgZGlyZWN0aW9uKCkgeyByZXR1cm4gdGhpcy5fZGlyZWN0aW9uOyB9XHJcbiAgQElucHV0KCkgc2V0IGRpcmVjdGlvbih2YWwpIHtcclxuICAgIGlmICh2YWwgIT09ICdib3R0b20nICYmIHZhbCAhPT0gJ2xlZnQnKSB7XHJcbiAgICAgIHZhbCA9ICdib3R0b20nO1xyXG4gICAgfVxyXG4gICAgdGhpcy5fZGlyZWN0aW9uID0gdmFsO1xyXG4gICAgc3dpdGNoICh2YWwpIHtcclxuICAgICAgY2FzZSAnbGVmdCc6XHJcbiAgICAgICAgdGhpcy5kaXJlY3Rpb25MZWZ0ID0gdHJ1ZTtcclxuICAgICAgICB0aGlzLmRpcmVjdGlvbkJvdHRvbSA9IGZhbHNlO1xyXG4gICAgICAgIGJyZWFrO1xyXG4gICAgICBkZWZhdWx0OlxyXG4gICAgICAgIHRoaXMuZGlyZWN0aW9uQm90dG9tID0gdHJ1ZTtcclxuICAgICAgICB0aGlzLmRpcmVjdGlvbkxlZnQgPSBmYWxzZTtcclxuICAgICAgICBicmVhaztcclxuICAgIH1cclxuICB9XHJcblxyXG5cclxuICBvbkNsaWNrKCkge1xyXG4gICAgdGhpcy5vcGVuID0gIXRoaXMub3BlbjtcclxuICAgIHRoaXMub3BlbkNoYW5nZS5lbWl0KHRoaXMub3Blbik7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgKm5nSWY9XCJkaXJlY3Rpb25Cb3R0b21cIiBjbGFzcz1cIndtLXBhbmVsLWJhciBkcmIgZmxleC1jb2xcIlxyXG4gICAgW25nU3R5bGVdPVwieydtYXgtd2lkdGgnOiBtYXhXaWR0aCwgJ21heC1oZWlnaHQnOiBtYXhIZWlnaHR9XCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwicGItaGVhZGVyIGFsaWduLWNlbnRlciBmbGV4LXJvd1wiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9e3tsYWJlbENsYXNzZXN9fSAqbmdJZj1cImxhYmVsXCI+e3tsYWJlbH19PC9kaXY+XHJcbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2hlYWRlckxhYmVsXVwiPjwvbmctY29udGVudD5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwicGItaGVhZGVyLWNvbnRlbnQgZmxleC1yb3dcIj5cclxuICAgICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2hlYWRlckNvbnRlbnRdXCI+PC9uZy1jb250ZW50PlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiZXgtYnV0dG9uXCIgKGNsaWNrKT1cIm9uQ2xpY2soKVwiPlxyXG4gICAgICAgICAgICAgICAgPHNwYW4+e3sgKG9wZW4gPyBjb2xsYXBzZVRleHQgOiBleHBhbmRUZXh0KX19PC9zcGFuPlxyXG4gICAgICAgICAgICAgICAgPHdtLXRlbXBsYXRlLWltYWdlIGNsYXNzPVwiYmFyLWFycm93XCIgW25nQ2xhc3NdPVwieydiYXItb3Blbi1ib3R0b20nOiBvcGVufVwiIGljb249XCJhcnJvdy1kb3duXCI+XHJcbiAgICAgICAgICAgICAgICA8L3dtLXRlbXBsYXRlLWltYWdlPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cImZsZXgtcm93IHBiLWNvbnRlbnQgcGItdmVydGljYWxcIiBbbmdTdHlsZV09XCJ7J2hlaWdodCc6ICFvcGVuID8gJzBweCc6ICcnfVwiXHJcbiAgICAgICAgW25nQ2xhc3NdPVwieydwYi12ZXJ0aWNhbC12aXNpYmxlJzogb3Blbn1cIj5cclxuICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiYm9keVwiPjwvbmctY29udGFpbmVyPlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PlxyXG5cclxuPGRpdiAqbmdJZj1cIiFkaXJlY3Rpb25Cb3R0b21cIiBjbGFzcz1cIndtLXBhbmVsLWJhciBmbGV4LWNvbCBkcmxcIiBbbmdDbGFzc109XCJ7J3BiLWRybC1vcGVuJzogb3Blbn1cIlxyXG4gICAgW25nU3R5bGVdPVwieydtYXgtd2lkdGgnOiBtYXhXaWR0aCwgJ21heC1oZWlnaHQnOiBtYXhIZWlnaHR9XCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwiZXgtcGFuZWwgZmxleC1yb3cgZXgtcGFuZWwtZHJsXCIgKGNsaWNrKT1cIm9uQ2xpY2soKVwiPlxyXG4gICAgICAgIDx3bS10ZW1wbGF0ZS1pbWFnZSBjbGFzcz1cImJhci1hcnJvdyBhcnJvdy1sZWZ0XCIgW25nQ2xhc3NdPVwieydiYXItb3Blbi1sZWZ0Jzogb3Blbn1cIiBpY29uPVwiYXJyb3ctbGVmdFwiPlxyXG4gICAgICAgIDwvd20tdGVtcGxhdGUtaW1hZ2U+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInByZXZpZXctbGFiZWxcIiAqbmdJZj1cIiFvcGVuXCI+e3tsYWJlbH19PC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInByZXZpZXctbGFiZWxcIiAqbmdJZj1cIm9wZW5cIj57e29wZW5lZExhYmVsIHx8IGxhYmVsfX08L2Rpdj5cclxuXHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJmbGV4LWNvbCBwYi1jb250ZW50IHBiLWhvcml6b250YWwtdmlzaWJsZVwiICpuZ0lmPVwib3BlblwiPlxyXG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJib2R5XCI+PC9uZy1jb250YWluZXI+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+XHJcblxyXG48bmctdGVtcGxhdGUgI2JvZHk+XHJcbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XHJcbjwvbmctdGVtcGxhdGU+Il19
|
|
@@ -627,10 +627,10 @@ class BtvSearch {
|
|
|
627
627
|
}
|
|
628
628
|
}
|
|
629
629
|
BtvSearch.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvSearch, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
630
|
-
BtvSearch.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvSearch, selector: "btv-search", inputs: { widthAuto: "widthAuto", isSmall: "isSmall", searchRight: "searchRight", placeholder: "placeholder", keepExpanded: "keepExpanded", searchText: "searchText" }, outputs: { searchTextChange: "searchTextChange" }, viewQueries: [{ propertyName: "box", first: true, predicate: ["searchBox"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
630
|
+
BtvSearch.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvSearch, selector: "btv-search", inputs: { widthAuto: "widthAuto", isSmall: "isSmall", searchRight: "searchRight", placeholder: "placeholder", keepExpanded: "keepExpanded", searchText: "searchText" }, outputs: { searchTextChange: "searchTextChange" }, viewQueries: [{ propertyName: "box", first: true, predicate: ["searchBox"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.wm-search.small .search-open{width:auto}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
631
631
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvSearch, decorators: [{
|
|
632
632
|
type: Component,
|
|
633
|
-
args: [{ selector: 'btv-search', template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"] }]
|
|
633
|
+
args: [{ selector: 'btv-search', template: "<div class=\"wm-search flex-row\" [ngClass]=\"{'search-reverse': searchRight == 'right', 'always-opened': keepExpanded, 'small': isSmall}\">\r\n\t<div class=\"search-icon inline-col\" [ngClass]=\"{'search-toggle-disabled': keepExpanded || !searchFocus}\"\r\n\t\t(click)=\"toggleSearch()\">\r\n\t\t<wm-template-image class=\"marginXA\" icon=\"search\" [light]=\"(!expanded && !searchFocus) || keepExpanded\">\r\n\t\t</wm-template-image>\r\n\t</div>\r\n\t<div class=\"search-wrap flex-col\"\r\n\t\t[ngClass]=\"{'search-open': keepExpanded || expanded, 'search-focused': (expanded && searchFocus) || (keepExpanded && searchFocus),\r\n\t'width-auto': widthAuto}\">\r\n\t\t<input class=\"search-field\" #searchBox \r\n\t\t\t[value]=\"searchText\" \r\n\t\t\t[placeholder]=\"placeholder\"\r\n\t\t\t(focus)=\"searchFocus = true\" (focusout)=\"onFocusOut()\">\r\n\t</div>\r\n</div>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-search,.search-wrap,.search-field{box-sizing:border-box}.wm-search:hover{border-color:var(--brandColor)}.wm-search{background:var(--pageBackgroundColor);height:36px;max-width:280px;border-radius:4px;align-items:center;flex:1 0 100%;flex-shrink:0;border:1px solid var(--secondaryHover)}.wm-search.small{max-width:140px}.wm-search.small .search-open{width:auto}.search-icon{width:36px;height:100%;flex-shrink:0;cursor:pointer}.search-icon.search-toggle-disabled{cursor:text}.search-wrap{width:0px;height:100%;color:var(--mediumFontColor);direction:ltr}.search-open{width:280px;max-width:100%;flex-grow:1;flex-shrink:1}.search-open.width-auto{width:auto}.search-open:hover,.search-focused{color:var(--strongFontColor)}.search-field{width:100%;height:100%;color:inherit;text-indent:.1em;font-size:16px;background-color:transparent;border:none;outline:none;padding:0 8px 0 0}.search-field::placeholder{color:var(--disabledTextColor)}.search-reverse{display:flex;flex-direction:row-reverse}.search-reverse .search-wrap{direction:rtl}.search-reverse .search-field{direction:ltr;padding:0 8px}@media not all and (-webkit-min-device-pixel-ratio: 0),not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none){.search-field{width:200px}}}\n"] }]
|
|
634
634
|
}], ctorParameters: function () { return []; }, propDecorators: { widthAuto: [{
|
|
635
635
|
type: Input
|
|
636
636
|
}], isSmall: [{
|
|
@@ -1010,13 +1010,22 @@ class WmPanelBarComponent {
|
|
|
1010
1010
|
this.labelClasses = 'pb-label';
|
|
1011
1011
|
this.maxHeight = 'unset';
|
|
1012
1012
|
this.maxWidth = 'unset';
|
|
1013
|
-
this.
|
|
1013
|
+
this._open = false;
|
|
1014
1014
|
this.collapseText = 'Collapse';
|
|
1015
1015
|
this.expandText = 'Expand';
|
|
1016
|
+
this.openChange = new EventEmitter();
|
|
1016
1017
|
this.directionBottom = true;
|
|
1017
1018
|
this.directionLeft = false;
|
|
1018
1019
|
this._direction = 'bottom';
|
|
1019
1020
|
}
|
|
1021
|
+
set open(value) {
|
|
1022
|
+
if (value === this._open)
|
|
1023
|
+
return;
|
|
1024
|
+
this._open = value;
|
|
1025
|
+
}
|
|
1026
|
+
get open() {
|
|
1027
|
+
return this._open;
|
|
1028
|
+
}
|
|
1020
1029
|
get direction() { return this._direction; }
|
|
1021
1030
|
set direction(val) {
|
|
1022
1031
|
if (val !== 'bottom' && val !== 'left') {
|
|
@@ -1036,10 +1045,11 @@ class WmPanelBarComponent {
|
|
|
1036
1045
|
}
|
|
1037
1046
|
onClick() {
|
|
1038
1047
|
this.open = !this.open;
|
|
1048
|
+
this.openChange.emit(this.open);
|
|
1039
1049
|
}
|
|
1040
1050
|
}
|
|
1041
1051
|
WmPanelBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WmPanelBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1042
|
-
WmPanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WmPanelBarComponent, selector: "wm-panel-bar", inputs: { label: "label", labelClasses: "labelClasses", openedLabel: "openedLabel", width: "width", height: "height", maxHeight: "maxHeight", maxWidth: "maxWidth", open: "open", collapseText: "collapseText", expandText: "expandText", direction: "direction" }, ngImport: i0, template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
1052
|
+
WmPanelBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WmPanelBarComponent, selector: "wm-panel-bar", inputs: { label: "label", labelClasses: "labelClasses", openedLabel: "openedLabel", width: "width", height: "height", maxHeight: "maxHeight", maxWidth: "maxWidth", open: "open", collapseText: "collapseText", expandText: "expandText", direction: "direction" }, outputs: { openChange: "openChange" }, ngImport: i0, template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }] });
|
|
1043
1053
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WmPanelBarComponent, decorators: [{
|
|
1044
1054
|
type: Component,
|
|
1045
1055
|
args: [{ selector: 'wm-panel-bar', template: "<div *ngIf=\"directionBottom\" class=\"wm-panel-bar drb flex-col\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"pb-header align-center flex-row\">\r\n <div class={{labelClasses}} *ngIf=\"label\">{{label}}</div>\r\n <ng-content select=\"[headerLabel]\"></ng-content>\r\n <div class=\"pb-header-content flex-row\">\r\n <ng-content select=\"[headerContent]\"></ng-content>\r\n <div class=\"ex-button\" (click)=\"onClick()\">\r\n <span>{{ (open ? collapseText : expandText)}}</span>\r\n <wm-template-image class=\"bar-arrow\" [ngClass]=\"{'bar-open-bottom': open}\" icon=\"arrow-down\">\r\n </wm-template-image>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex-row pb-content pb-vertical\" [ngStyle]=\"{'height': !open ? '0px': ''}\"\r\n [ngClass]=\"{'pb-vertical-visible': open}\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"!directionBottom\" class=\"wm-panel-bar flex-col drl\" [ngClass]=\"{'pb-drl-open': open}\"\r\n [ngStyle]=\"{'max-width': maxWidth, 'max-height': maxHeight}\">\r\n <div class=\"ex-panel flex-row ex-panel-drl\" (click)=\"onClick()\">\r\n <wm-template-image class=\"bar-arrow arrow-left\" [ngClass]=\"{'bar-open-left': open}\" icon=\"arrow-left\">\r\n </wm-template-image>\r\n <div class=\"preview-label\" *ngIf=\"!open\">{{label}}</div>\r\n <div class=\"preview-label\" *ngIf=\"open\">{{openedLabel || label}}</div>\r\n\r\n </div>\r\n <div class=\"flex-col pb-content pb-horizontal-visible\" *ngIf=\"open\">\r\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #body>\r\n <ng-content></ng-content>\r\n</ng-template>", styles: ["@media print{body{all:unset!important}.wm-page{margin:0!important;display:block!important}.not-printable{display:none!important}*{visibility:hidden}.printable,.printable *{visibility:visible!important}}.wm-panel-bar{border-radius:4px;background:var(--pageBackgroundColor);flex-shrink:0;overflow:hidden;direction:ltr}.ex-button{display:inline-flex;color:var(--mediumFontColor);letter-spacing:0;cursor:pointer;background:transparent;border:none;justify-content:flex-end;align-items:center;width:86px;margin-left:8px}.pb-header{width:100%;flex-shrink:0;min-height:48px;font-size:14px;box-sizing:border-box;padding:4px 16px}.pb-label,.brand-label{font-weight:700;color:var(--strongFontColor);letter-spacing:1.2px;line-height:16px;flex-shrink:0;margin-right:12px}.brand-label{color:var(--brandColor)}.pb-header-content{align-items:center;margin-left:auto}.bar-open-left,.bar-open-right{transform:rotateY(-180deg)}.drb{box-shadow:0 0 1px #0a16460f,0 1px 1px #0a16461a}.drr{flex-direction:row-reverse}.pb-drl-open{width:100%}.pb-vertical{height:0}.pb-content{direction:ltr;visibility:hidden;overflow:auto}.pb-vertical-visible{visibility:visible;height:100%;max-height:calc(100% - 48px)}.pb-horizontal-visible{visibility:visible;width:100%}.ex-panel{height:40px;width:auto;min-width:1px;max-width:100%;flex-shrink:0;cursor:pointer;background:transparent;border-radius:4px;box-shadow:1px 1px 2px 2px #0a16460f;justify-content:flex-start}.arrow-left{margin:auto 0}.preview-label{align-items:center;margin:auto 4px}\n"] }]
|
|
@@ -1063,6 +1073,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImpor
|
|
|
1063
1073
|
type: Input
|
|
1064
1074
|
}], expandText: [{
|
|
1065
1075
|
type: Input
|
|
1076
|
+
}], openChange: [{
|
|
1077
|
+
type: Output
|
|
1066
1078
|
}], direction: [{
|
|
1067
1079
|
type: Input
|
|
1068
1080
|
}] } });
|