btv-base-controls 0.1.13 → 0.1.15
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-icon-button/btv-counter-button.mjs +2 -2
- package/esm2020/lib/btv-icon-button/btv-icon-button.component.mjs +2 -2
- package/esm2020/lib/btv-search/btv-search.component.mjs +2 -2
- package/esm2020/lib/busy-indicator/busy-indicator.component.mjs +2 -2
- package/esm2020/lib/wm-panel-bar/wm-panel-bar.component.mjs +16 -4
- package/esm2020/lib/wm-spinner/wm-spinner.component.mjs +2 -2
- package/fesm2015/btv-base-controls.mjs +24 -12
- package/fesm2015/btv-base-controls.mjs.map +1 -1
- package/fesm2020/btv-base-controls.mjs +24 -12
- 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
|
@@ -464,10 +464,10 @@ class BtvIconButtonComponent {
|
|
|
464
464
|
}
|
|
465
465
|
}
|
|
466
466
|
BtvIconButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
467
|
-
BtvIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvIconButtonComponent, selector: "btv-icon-button", inputs: { titleText: "titleText", disabled: "disabled", size: "size", icon: "icon", changed: "changed", isTabStop: "isTabStop", light: "light", buttonClasses: "buttonClasses", imageClasses: "imageClasses", danger: "danger", unavailableText: "unavailableText" }, outputs: { iClick: "iClick" }, host: { properties: { "class.disabled": "this.getIsDisabled", "class.small": "this.getIsSmall", "class.medium": "this.getIsMedium", "class.danger": "this.getIsDanger" } }, ngImport: i0, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\" [classes]=\"imageClasses\">\r\n </wm-template-image>\r\n <ng-content></ng-content>\r\n\r\n</button>\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-text\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:
|
|
467
|
+
BtvIconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvIconButtonComponent, selector: "btv-icon-button", inputs: { titleText: "titleText", disabled: "disabled", size: "size", icon: "icon", changed: "changed", isTabStop: "isTabStop", light: "light", buttonClasses: "buttonClasses", imageClasses: "imageClasses", danger: "danger", unavailableText: "unavailableText" }, outputs: { iClick: "iClick" }, host: { properties: { "class.disabled": "this.getIsDisabled", "class.small": "this.getIsSmall", "class.medium": "this.getIsMedium", "class.danger": "this.getIsDanger" } }, ngImport: i0, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\" [classes]=\"imageClasses\">\r\n </wm-template-image>\r\n <ng-content></ng-content>\r\n\r\n</button>\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-text\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:0;right:0;border:none;background-color:var(--dangerColor);border-radius:50%;font-size:10px;font-weight:700;text-align:center;color:var(--strongFontColor);text-indent:-1px;overflow:hidden;white-space:nowrap}.u-btn-validate{border-color:var(--dangerColor);background-color:var(--dangerColor);color:var(--onBrandTextColor)}.u-btn-validate:hover{background-color:var(--dangerColor)}.u-btn-primary{border-color:var(--brandColor);background-color:var(--brandColor);color:var(--onBrandTextColor)}.u-btn-primary:hover{background-color:var(--onBrandHoverColor)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }, { kind: "directive", type: ToolTipRendererDirective, selector: "[customToolTip]", inputs: ["showToolTip", "customToolTip", "contentTemplate", "customAnchor", "useCustom"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
468
468
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvIconButtonComponent, decorators: [{
|
|
469
469
|
type: Component,
|
|
470
|
-
args: [{ selector: 'btv-icon-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\" [classes]=\"imageClasses\">\r\n </wm-template-image>\r\n <ng-content></ng-content>\r\n\r\n</button>\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-text\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:
|
|
470
|
+
args: [{ selector: 'btv-icon-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\" [classes]=\"imageClasses\">\r\n </wm-template-image>\r\n <ng-content></ng-content>\r\n\r\n</button>\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-text\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:0;right:0;border:none;background-color:var(--dangerColor);border-radius:50%;font-size:10px;font-weight:700;text-align:center;color:var(--strongFontColor);text-indent:-1px;overflow:hidden;white-space:nowrap}.u-btn-validate{border-color:var(--dangerColor);background-color:var(--dangerColor);color:var(--onBrandTextColor)}.u-btn-validate:hover{background-color:var(--dangerColor)}.u-btn-primary{border-color:var(--brandColor);background-color:var(--brandColor);color:var(--onBrandTextColor)}.u-btn-primary:hover{background-color:var(--onBrandHoverColor)}\n"] }]
|
|
471
471
|
}], ctorParameters: function () { return []; }, propDecorators: { getIsDisabled: [{
|
|
472
472
|
type: HostBinding,
|
|
473
473
|
args: ['class.disabled']
|
|
@@ -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}.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}
|
|
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}\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}.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}
|
|
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}\n"] }]
|
|
634
634
|
}], ctorParameters: function () { return []; }, propDecorators: { widthAuto: [{
|
|
635
635
|
type: Input
|
|
636
636
|
}], isSmall: [{
|
|
@@ -653,10 +653,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImpor
|
|
|
653
653
|
class BusyIndicatorComponent {
|
|
654
654
|
}
|
|
655
655
|
BusyIndicatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BusyIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
656
|
-
BusyIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BusyIndicatorComponent, selector: "wm-busy-indicator", inputs: { busy: "busy", long: "long" }, ngImport: i0, template: "<div class=\"load-snake-wrap\" *ngIf=\"busy\" [ngClass]=\"{'long-snake-wrap': long}\">\r\n <span class=\"snake-field\" ></span>\r\n <span class=\"snake\" [ngClass]=\"{'longSnake': long}\">\r\n <span class=\"snake-shadow\" [ngClass]=\"{'longRotate': long}\"></span>\r\n </span>\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}}.load-snake-wrap{width:120px;height:12px;overflow:hidden;align-self:flex-end}.snake-field{display:block;width:100%;height:2px;background:#22252C;top:5px;position:relative}.snake{display:inline-block;width:80px;height:2px;background:#7F868C;animation-play-state:running;position:relative;top:-9px;animation:snakeMove 2s linear 0s infinite}.snake-shadow{display:inline-block;width:40px;height:8px;position:absolute;margin-top:-3px;animation:rotate 2s linear 0s infinite;animation-play-state:running;border-radius:25%}.long-snake-wrap{width:400px}.longSnake{animation:snakeLongMove 3s linear 0s infinite}.longRotate{animation:rotate 3s linear 0s infinite}@keyframes snakeMove{0%{left:-80px}50%{left:200px}to{left:-200px}}@keyframes snakeLongMove{0%{left:-80px}50%{left:440px}to{left:-200px}}@keyframes rotate{0%{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);right:
|
|
656
|
+
BusyIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BusyIndicatorComponent, selector: "wm-busy-indicator", inputs: { busy: "busy", long: "long" }, ngImport: i0, template: "<div class=\"load-snake-wrap\" *ngIf=\"busy\" [ngClass]=\"{'long-snake-wrap': long}\">\r\n <span class=\"snake-field\" ></span>\r\n <span class=\"snake\" [ngClass]=\"{'longSnake': long}\">\r\n <span class=\"snake-shadow\" [ngClass]=\"{'longRotate': long}\"></span>\r\n </span>\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}}.load-snake-wrap{width:120px;height:12px;overflow:hidden;align-self:flex-end}.snake-field{display:block;width:100%;height:2px;background:#22252C;top:5px;position:relative}.snake{display:inline-block;width:80px;height:2px;background:#7F868C;animation-play-state:running;position:relative;top:-9px;animation:snakeMove 2s linear 0s infinite}.snake-shadow{display:inline-block;width:40px;height:8px;position:absolute;margin-top:-3px;animation:rotate 2s linear 0s infinite;animation-play-state:running;border-radius:25%}.long-snake-wrap{width:400px}.longSnake{animation:snakeLongMove 3s linear 0s infinite}.longRotate{animation:rotate 3s linear 0s infinite}@keyframes snakeMove{0%{left:-80px}50%{left:200px}to{left:-200px}}@keyframes snakeLongMove{0%{left:-80px}50%{left:440px}to{left:-200px}}@keyframes rotate{0%{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);right:0}to{background:linear-gradient(to left,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);left:0;right:unset}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
657
657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BusyIndicatorComponent, decorators: [{
|
|
658
658
|
type: Component,
|
|
659
|
-
args: [{ selector: 'wm-busy-indicator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"load-snake-wrap\" *ngIf=\"busy\" [ngClass]=\"{'long-snake-wrap': long}\">\r\n <span class=\"snake-field\" ></span>\r\n <span class=\"snake\" [ngClass]=\"{'longSnake': long}\">\r\n <span class=\"snake-shadow\" [ngClass]=\"{'longRotate': long}\"></span>\r\n </span>\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}}.load-snake-wrap{width:120px;height:12px;overflow:hidden;align-self:flex-end}.snake-field{display:block;width:100%;height:2px;background:#22252C;top:5px;position:relative}.snake{display:inline-block;width:80px;height:2px;background:#7F868C;animation-play-state:running;position:relative;top:-9px;animation:snakeMove 2s linear 0s infinite}.snake-shadow{display:inline-block;width:40px;height:8px;position:absolute;margin-top:-3px;animation:rotate 2s linear 0s infinite;animation-play-state:running;border-radius:25%}.long-snake-wrap{width:400px}.longSnake{animation:snakeLongMove 3s linear 0s infinite}.longRotate{animation:rotate 3s linear 0s infinite}@keyframes snakeMove{0%{left:-80px}50%{left:200px}to{left:-200px}}@keyframes snakeLongMove{0%{left:-80px}50%{left:440px}to{left:-200px}}@keyframes rotate{0%{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);right:
|
|
659
|
+
args: [{ selector: 'wm-busy-indicator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"load-snake-wrap\" *ngIf=\"busy\" [ngClass]=\"{'long-snake-wrap': long}\">\r\n <span class=\"snake-field\" ></span>\r\n <span class=\"snake\" [ngClass]=\"{'longSnake': long}\">\r\n <span class=\"snake-shadow\" [ngClass]=\"{'longRotate': long}\"></span>\r\n </span>\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}}.load-snake-wrap{width:120px;height:12px;overflow:hidden;align-self:flex-end}.snake-field{display:block;width:100%;height:2px;background:#22252C;top:5px;position:relative}.snake{display:inline-block;width:80px;height:2px;background:#7F868C;animation-play-state:running;position:relative;top:-9px;animation:snakeMove 2s linear 0s infinite}.snake-shadow{display:inline-block;width:40px;height:8px;position:absolute;margin-top:-3px;animation:rotate 2s linear 0s infinite;animation-play-state:running;border-radius:25%}.long-snake-wrap{width:400px}.longSnake{animation:snakeLongMove 3s linear 0s infinite}.longRotate{animation:rotate 3s linear 0s infinite}@keyframes snakeMove{0%{left:-80px}50%{left:200px}to{left:-200px}}@keyframes snakeLongMove{0%{left:-80px}50%{left:440px}to{left:-200px}}@keyframes rotate{0%{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);right:0}to{background:linear-gradient(to left,rgba(0,0,0,0) 0%,rgba(152,141,103,.4) 100%);left:0;right:unset}}\n"] }]
|
|
660
660
|
}], propDecorators: { busy: [{
|
|
661
661
|
type: Input
|
|
662
662
|
}], long: [{
|
|
@@ -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
|
}] } });
|
|
@@ -1289,10 +1301,10 @@ class SpinnerComponent {
|
|
|
1289
1301
|
}
|
|
1290
1302
|
}
|
|
1291
1303
|
SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: SpinnerComponent, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1292
|
-
SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: SpinnerComponent, selector: "wm-spinner", inputs: { delay: "delay", longMessageDelay: "longMessageDelay", message: "message", messageTakesLong: "messageTakesLong", messageBottomWait: "messageBottomWait", detailInfoMessage: "detailInfoMessage", infoType: "infoType", showSpinner: "showSpinner" }, ngImport: i0, template: "<div class=\"spinner-wrap flex-col wh-100\" *ngIf=\"isOverlayVisible\">\r\n <div class=\"spinner-bg wh-100\" [ngClass]=\"{'invisible': !isOverlayContrast }\"></div>\r\n <div class=\"spinner-content inline-col marginXA align-center\" [ngClass]=\"{'invisible': !isOverlayContrast }\">\r\n <div class=\"msg-wrap marginBottomX8\">\r\n <div style=\"display: flex\">\r\n <div class=\"msg\">{{message}}</div>\r\n <wm-info class=\"info\" [type]=\"infoType\" popupPosition=\"top-center\" \r\n [iconAsTemplate]=\"infoType===2\" [useThemeForIconTemplate]=\"infoType===2\"\r\n *ngIf=\"detailInfoMessage\" [header]=\"detailInfoMessage\" style=\"margin-left: 4px\"></wm-info>\r\n </div>\r\n \r\n <div class=\"msg\">{{messageBottomWait}}</div>\r\n </div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 168 168\" id=\"loader\">\r\n <defs>\r\n <linearGradient id=\"a\" x1=\"38.078%\" x2=\"4.941%\" y1=\"8.411%\" y2=\"16.987%\">\r\n <stop offset=\"0%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.1\" />\r\n <stop offset=\"61.554%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.4\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </linearGradient>\r\n <radialGradient id=\"b\" cy=\"43.835%\" r=\"54.9%\" fx=\"50%\" fy=\"43.835%\"\r\n gradientTransform=\"matrix(-.77913 .62687 -.6485 -.80602 1.174 .478)\">\r\n <stop offset=\"0%\" stop-color=\"#FFF\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </radialGradient>\r\n </defs>\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <g transform=\"translate(10 10)\">\r\n <path stroke=\"url(#a)\" stroke-linecap=\"round\" stroke-width=\"19\"\r\n d=\"M16.198 27.79C6.062 40.453 0 56.518 0 74c0 40.87 33.13 74 74 74s74-33.13 74-74c0-24.611-12.014-46.416-30.498-59.87C105.292 5.244 90.258 0 74 0\" />\r\n <circle cx=\"16.5\" cy=\"27.5\" r=\"9.5\" fill=\"url(#b)\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n\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}}.spinner-wrap{position:fixed;
|
|
1304
|
+
SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: SpinnerComponent, selector: "wm-spinner", inputs: { delay: "delay", longMessageDelay: "longMessageDelay", message: "message", messageTakesLong: "messageTakesLong", messageBottomWait: "messageBottomWait", detailInfoMessage: "detailInfoMessage", infoType: "infoType", showSpinner: "showSpinner" }, ngImport: i0, template: "<div class=\"spinner-wrap flex-col wh-100\" *ngIf=\"isOverlayVisible\">\r\n <div class=\"spinner-bg wh-100\" [ngClass]=\"{'invisible': !isOverlayContrast }\"></div>\r\n <div class=\"spinner-content inline-col marginXA align-center\" [ngClass]=\"{'invisible': !isOverlayContrast }\">\r\n <div class=\"msg-wrap marginBottomX8\">\r\n <div style=\"display: flex\">\r\n <div class=\"msg\">{{message}}</div>\r\n <wm-info class=\"info\" [type]=\"infoType\" popupPosition=\"top-center\" \r\n [iconAsTemplate]=\"infoType===2\" [useThemeForIconTemplate]=\"infoType===2\"\r\n *ngIf=\"detailInfoMessage\" [header]=\"detailInfoMessage\" style=\"margin-left: 4px\"></wm-info>\r\n </div>\r\n \r\n <div class=\"msg\">{{messageBottomWait}}</div>\r\n </div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 168 168\" id=\"loader\">\r\n <defs>\r\n <linearGradient id=\"a\" x1=\"38.078%\" x2=\"4.941%\" y1=\"8.411%\" y2=\"16.987%\">\r\n <stop offset=\"0%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.1\" />\r\n <stop offset=\"61.554%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.4\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </linearGradient>\r\n <radialGradient id=\"b\" cy=\"43.835%\" r=\"54.9%\" fx=\"50%\" fy=\"43.835%\"\r\n gradientTransform=\"matrix(-.77913 .62687 -.6485 -.80602 1.174 .478)\">\r\n <stop offset=\"0%\" stop-color=\"#FFF\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </radialGradient>\r\n </defs>\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <g transform=\"translate(10 10)\">\r\n <path stroke=\"url(#a)\" stroke-linecap=\"round\" stroke-width=\"19\"\r\n d=\"M16.198 27.79C6.062 40.453 0 56.518 0 74c0 40.87 33.13 74 74 74s74-33.13 74-74c0-24.611-12.014-46.416-30.498-59.87C105.292 5.244 90.258 0 74 0\" />\r\n <circle cx=\"16.5\" cy=\"27.5\" r=\"9.5\" fill=\"url(#b)\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n\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}}.spinner-wrap{position:fixed;inset:0;z-index:5;text-shadow:0px 0px 0px var(--pageBackgroundColor);pointer-events:all}.spinner-bg{position:absolute;top:0;left:0;transition:opacity .4s ease-in;opacity:.7;background-color:var(--appBackgroundColor)}.invisible{opacity:.01}.spinner-content{z-index:1;width:80%;height:80%;min-width:120px;min-height:120px;max-width:400px;max-height:400px}.msg-wrap{width:auto;max-width:400px;box-sizing:border-box;text-align:center;font-size:16px;color:var(--strongFontColor);line-height:32px;font-weight:500;word-break:break-word}@media all and (max-width: 767px){.msg-wrap{font-size:14px;line-height:24px}}#loader{animation:rotation 2s infinite linear;animation-play-state:running;width:50%;height:50%;min-width:120px;min-height:120px;max-width:240px;max-height:240px;margin:0 auto}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WmInfoComponent, selector: "wm-info", inputs: ["preText", "postText", "header", "type", "popupPosition", "iconAsTemplate", "useThemeForIconTemplate", "smallIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1293
1305
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
1294
1306
|
type: Component,
|
|
1295
|
-
args: [{ selector: 'wm-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"spinner-wrap flex-col wh-100\" *ngIf=\"isOverlayVisible\">\r\n <div class=\"spinner-bg wh-100\" [ngClass]=\"{'invisible': !isOverlayContrast }\"></div>\r\n <div class=\"spinner-content inline-col marginXA align-center\" [ngClass]=\"{'invisible': !isOverlayContrast }\">\r\n <div class=\"msg-wrap marginBottomX8\">\r\n <div style=\"display: flex\">\r\n <div class=\"msg\">{{message}}</div>\r\n <wm-info class=\"info\" [type]=\"infoType\" popupPosition=\"top-center\" \r\n [iconAsTemplate]=\"infoType===2\" [useThemeForIconTemplate]=\"infoType===2\"\r\n *ngIf=\"detailInfoMessage\" [header]=\"detailInfoMessage\" style=\"margin-left: 4px\"></wm-info>\r\n </div>\r\n \r\n <div class=\"msg\">{{messageBottomWait}}</div>\r\n </div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 168 168\" id=\"loader\">\r\n <defs>\r\n <linearGradient id=\"a\" x1=\"38.078%\" x2=\"4.941%\" y1=\"8.411%\" y2=\"16.987%\">\r\n <stop offset=\"0%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.1\" />\r\n <stop offset=\"61.554%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.4\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </linearGradient>\r\n <radialGradient id=\"b\" cy=\"43.835%\" r=\"54.9%\" fx=\"50%\" fy=\"43.835%\"\r\n gradientTransform=\"matrix(-.77913 .62687 -.6485 -.80602 1.174 .478)\">\r\n <stop offset=\"0%\" stop-color=\"#FFF\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </radialGradient>\r\n </defs>\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <g transform=\"translate(10 10)\">\r\n <path stroke=\"url(#a)\" stroke-linecap=\"round\" stroke-width=\"19\"\r\n d=\"M16.198 27.79C6.062 40.453 0 56.518 0 74c0 40.87 33.13 74 74 74s74-33.13 74-74c0-24.611-12.014-46.416-30.498-59.87C105.292 5.244 90.258 0 74 0\" />\r\n <circle cx=\"16.5\" cy=\"27.5\" r=\"9.5\" fill=\"url(#b)\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n\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}}.spinner-wrap{position:fixed;
|
|
1307
|
+
args: [{ selector: 'wm-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"spinner-wrap flex-col wh-100\" *ngIf=\"isOverlayVisible\">\r\n <div class=\"spinner-bg wh-100\" [ngClass]=\"{'invisible': !isOverlayContrast }\"></div>\r\n <div class=\"spinner-content inline-col marginXA align-center\" [ngClass]=\"{'invisible': !isOverlayContrast }\">\r\n <div class=\"msg-wrap marginBottomX8\">\r\n <div style=\"display: flex\">\r\n <div class=\"msg\">{{message}}</div>\r\n <wm-info class=\"info\" [type]=\"infoType\" popupPosition=\"top-center\" \r\n [iconAsTemplate]=\"infoType===2\" [useThemeForIconTemplate]=\"infoType===2\"\r\n *ngIf=\"detailInfoMessage\" [header]=\"detailInfoMessage\" style=\"margin-left: 4px\"></wm-info>\r\n </div>\r\n \r\n <div class=\"msg\">{{messageBottomWait}}</div>\r\n </div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 168 168\" id=\"loader\">\r\n <defs>\r\n <linearGradient id=\"a\" x1=\"38.078%\" x2=\"4.941%\" y1=\"8.411%\" y2=\"16.987%\">\r\n <stop offset=\"0%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.1\" />\r\n <stop offset=\"61.554%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.4\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </linearGradient>\r\n <radialGradient id=\"b\" cy=\"43.835%\" r=\"54.9%\" fx=\"50%\" fy=\"43.835%\"\r\n gradientTransform=\"matrix(-.77913 .62687 -.6485 -.80602 1.174 .478)\">\r\n <stop offset=\"0%\" stop-color=\"#FFF\" />\r\n <stop offset=\"100%\" stop-color=\"var(--brandColor)\" stop-opacity=\"0.5\" />\r\n </radialGradient>\r\n </defs>\r\n <g fill=\"none\" fill-rule=\"evenodd\">\r\n <g transform=\"translate(10 10)\">\r\n <path stroke=\"url(#a)\" stroke-linecap=\"round\" stroke-width=\"19\"\r\n d=\"M16.198 27.79C6.062 40.453 0 56.518 0 74c0 40.87 33.13 74 74 74s74-33.13 74-74c0-24.611-12.014-46.416-30.498-59.87C105.292 5.244 90.258 0 74 0\" />\r\n <circle cx=\"16.5\" cy=\"27.5\" r=\"9.5\" fill=\"url(#b)\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </div>\r\n\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}}.spinner-wrap{position:fixed;inset:0;z-index:5;text-shadow:0px 0px 0px var(--pageBackgroundColor);pointer-events:all}.spinner-bg{position:absolute;top:0;left:0;transition:opacity .4s ease-in;opacity:.7;background-color:var(--appBackgroundColor)}.invisible{opacity:.01}.spinner-content{z-index:1;width:80%;height:80%;min-width:120px;min-height:120px;max-width:400px;max-height:400px}.msg-wrap{width:auto;max-width:400px;box-sizing:border-box;text-align:center;font-size:16px;color:var(--strongFontColor);line-height:32px;font-weight:500;word-break:break-word}@media all and (max-width: 767px){.msg-wrap{font-size:14px;line-height:24px}}#loader{animation:rotation 2s infinite linear;animation-play-state:running;width:50%;height:50%;min-width:120px;min-height:120px;max-width:240px;max-height:240px;margin:0 auto}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
1296
1308
|
}], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { delay: [{
|
|
1297
1309
|
type: Input
|
|
1298
1310
|
}], longMessageDelay: [{
|
|
@@ -1409,10 +1421,10 @@ class BtvCounterButtonComponent extends BtvIconButtonComponent {
|
|
|
1409
1421
|
}
|
|
1410
1422
|
}
|
|
1411
1423
|
BtvCounterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvCounterButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1412
|
-
BtvCounterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvCounterButtonComponent, selector: "btv-counter-button", inputs: { counter: "counter", unavailableText: "unavailableText" }, usesInheritance: true, ngImport: i0, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\">\r\n </wm-template-image>\r\n\r\n <ng-content></ng-content>\r\n\r\n <span class=\"wm-counter\" [title]=\"counter\" *ngIf=\"counter > 0\">{{counterLabel}}</span>\r\n\r\n</button>\r\n\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-disabled\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:
|
|
1424
|
+
BtvCounterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BtvCounterButtonComponent, selector: "btv-counter-button", inputs: { counter: "counter", unavailableText: "unavailableText" }, usesInheritance: true, ngImport: i0, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\">\r\n </wm-template-image>\r\n\r\n <ng-content></ng-content>\r\n\r\n <span class=\"wm-counter\" [title]=\"counter\" *ngIf=\"counter > 0\">{{counterLabel}}</span>\r\n\r\n</button>\r\n\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-disabled\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:0;right:0;border:none;background-color:var(--dangerColor);border-radius:50%;font-size:10px;font-weight:700;text-align:center;color:var(--strongFontColor);text-indent:-1px;overflow:hidden;white-space:nowrap}.u-btn-validate{border-color:var(--dangerColor);background-color:var(--dangerColor);color:var(--onBrandTextColor)}.u-btn-validate:hover{background-color:var(--dangerColor)}.u-btn-primary{border-color:var(--brandColor);background-color:var(--brandColor);color:var(--onBrandTextColor)}.u-btn-primary:hover{background-color:var(--onBrandHoverColor)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WmTemplateImageComponent, selector: "wm-template-image", inputs: ["icon", "disabled", "active", "light", "classes", "backgroundColor", "size", "sizeBox"] }, { kind: "directive", type: ToolTipRendererDirective, selector: "[customToolTip]", inputs: ["showToolTip", "customToolTip", "contentTemplate", "customAnchor", "useCustom"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1413
1425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BtvCounterButtonComponent, decorators: [{
|
|
1414
1426
|
type: Component,
|
|
1415
|
-
args: [{ selector: 'btv-counter-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\">\r\n </wm-template-image>\r\n\r\n <ng-content></ng-content>\r\n\r\n <span class=\"wm-counter\" [title]=\"counter\" *ngIf=\"counter > 0\">{{counterLabel}}</span>\r\n\r\n</button>\r\n\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-disabled\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:
|
|
1427
|
+
args: [{ selector: 'btv-counter-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"icon flex-row {{buttonClasses}}\" (click)=\"onClick($event)\" type=\"button\" #button\r\n [tabindex]=\"(!isTabStop || disabled) ? -1 : undefined\" [showToolTip]=\"!!titleText\" customToolTip [contentTemplate]=\"template\">\r\n\r\n <wm-template-image [icon]=\"icon\" [size]=\"floor(iconSize * (isHover ? 1.1: 1)) + 'px'\" [active]=\"!disabled && changed\"\r\n [light]=\"light\">\r\n </wm-template-image>\r\n\r\n <ng-content></ng-content>\r\n\r\n <span class=\"wm-counter\" [title]=\"counter\" *ngIf=\"counter > 0\">{{counterLabel}}</span>\r\n\r\n</button>\r\n\r\n\r\n<ng-template #template>\r\n <span class=\"tooltip-text\"> {{titleText}} </span>\r\n <span *ngIf=\"disabled\" class=\"tooltip-disabled\"> - {{unavailableText}} </span>\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}}:host{display:block;background:var(--pageBackgroundColor);border:1px solid;border-radius:4px;border-color:var(--secondaryHover);cursor:pointer;box-sizing:border-box;width:36px;height:36px;flex-shrink:0}:host:focus .icon,:host:hover .icon{outline:none;background:var(--secondaryHover)}:host(.u-no-border){border-width:0px}:host(.small){width:16px;height:16px}:host(.medium){width:30px;height:30px}:host(.disabled){background-color:var(--disabledColor);border-color:var(--disabledColor);color:var(--lightFontColor);cursor:default}:host(.disabled):hover{background-color:var(--disabledColor);border-color:var(--disabledColor)}:host(.disabled) .icon{cursor:default}:host(.danger){background-color:var(--dangerColor);border-color:var(--warningColor)}.tooltip-text{align-self:center}.tooltip-disabled{font-size:14px -2;counter-reset:var(--lightFontColor)}.icon{justify-content:center;align-items:center;width:100%;height:100%;border:0px;cursor:pointer;color:var(--strongFontColor);outline:0px;padding:0;background:transparent;border-radius:inherit}.wm-counter-button{position:relative}.wm-counter{display:inline-block;width:16px;height:16px;line-height:16px;position:absolute;top:0;right:0;border:none;background-color:var(--dangerColor);border-radius:50%;font-size:10px;font-weight:700;text-align:center;color:var(--strongFontColor);text-indent:-1px;overflow:hidden;white-space:nowrap}.u-btn-validate{border-color:var(--dangerColor);background-color:var(--dangerColor);color:var(--onBrandTextColor)}.u-btn-validate:hover{background-color:var(--dangerColor)}.u-btn-primary{border-color:var(--brandColor);background-color:var(--brandColor);color:var(--onBrandTextColor)}.u-btn-primary:hover{background-color:var(--onBrandHoverColor)}\n"] }]
|
|
1416
1428
|
}], propDecorators: { counter: [{
|
|
1417
1429
|
type: Input
|
|
1418
1430
|
}], unavailableText: [{
|