@villedemontreal/angular-ui 16.0.3 → 16.0.5
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/esm2022/lib/dropdown-menu/dropdown-menu.component.mjs +71 -49
- package/esm2022/lib/file/file-preview.component.mjs +20 -13
- package/esm2022/lib/list/list.component.mjs +3 -3
- package/fesm2022/villedemontreal-angular-ui.mjs +91 -62
- package/fesm2022/villedemontreal-angular-ui.mjs.map +1 -1
- package/lib/dropdown-menu/dropdown-menu.component.d.ts +2 -11
- package/lib/file/file-preview.component.d.ts +7 -6
- package/lib/list/list.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -7,14 +7,14 @@ import { Component, Directive, ViewEncapsulation } from '@angular/core';
|
|
|
7
7
|
import * as i0 from "@angular/core";
|
|
8
8
|
export class BaoListItem {
|
|
9
9
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoListItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoListItem, selector: "bao-list-item, [bao-list-item]", host: { attributes: { "role": "listitem" }, classAttribute: "bao-list-item" }, ngImport: i0, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoListItem, selector: "bao-list-item, [bao-list-item]", host: { attributes: { "role": "listitem" }, classAttribute: "bao-list-item" }, ngImport: i0, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n<div class=\"bao-list-item-actions\">\n <ng-content\n select=\"bao-button, [bao-button], bao-dropdown-menu, [bao-dropdown-menu]\"\n >\n </ng-content>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}.bao-list .bao-list-item>.bao-list-item-actions .bao-button{margin-left:2rem;margin-top:-.5rem}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
11
11
|
}
|
|
12
12
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoListItem, decorators: [{
|
|
13
13
|
type: Component,
|
|
14
14
|
args: [{ selector: 'bao-list-item, [bao-list-item]', encapsulation: ViewEncapsulation.None, host: {
|
|
15
15
|
class: 'bao-list-item',
|
|
16
16
|
role: 'listitem'
|
|
17
|
-
}, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}\n"] }]
|
|
17
|
+
}, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n<div class=\"bao-list-item-actions\">\n <ng-content\n select=\"bao-button, [bao-button], bao-dropdown-menu, [bao-dropdown-menu]\"\n >\n </ng-content>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}.bao-list .bao-list-item>.bao-list-item-actions .bao-button{margin-left:2rem;margin-top:-.5rem}\n"] }]
|
|
18
18
|
}] });
|
|
19
19
|
export class BaoList {
|
|
20
20
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
@@ -70,4 +70,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
70
70
|
}
|
|
71
71
|
}]
|
|
72
72
|
}] });
|
|
73
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
73
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLXVpL3NyYy9saWIvbGlzdC9saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItdWkvc3JjL2xpYi9saXN0L2xpc3QtaXRlbS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7OztHQUlHO0FBQ0gsT0FBTyxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBWXhFLE1BQU0sT0FBTyxXQUFXOzhHQUFYLFdBQVc7a0dBQVgsV0FBVyxxSkNqQnhCLGlqQkFtQkE7OzJGREZhLFdBQVc7a0JBVnZCLFNBQVM7K0JBQ0UsZ0NBQWdDLGlCQUczQixpQkFBaUIsQ0FBQyxJQUFJLFFBQy9CO3dCQUNKLEtBQUssRUFBRSxlQUFlO3dCQUN0QixJQUFJLEVBQUUsVUFBVTtxQkFDakI7O0FBV0gsTUFBTSxPQUFPLE9BQU87OEdBQVAsT0FBTztrR0FBUCxPQUFPOzsyRkFBUCxPQUFPO2tCQVBuQixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxzQkFBc0I7b0JBQ2hDLElBQUksRUFBRTt3QkFDSixLQUFLLEVBQUUsVUFBVTt3QkFDakIsSUFBSSxFQUFFLE1BQU07cUJBQ2I7aUJBQ0Y7O0FBVUQsTUFBTSxPQUFPLFVBQVU7OEdBQVYsVUFBVTtrR0FBVixVQUFVOzsyRkFBVixVQUFVO2tCQVB0QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSw4QkFBOEI7b0JBQ3hDLElBQUksRUFBRTt3QkFDSixLQUFLLEVBQUUsVUFBVTt3QkFDakIsSUFBSSxFQUFFLFlBQVk7cUJBQ25CO2lCQUNGOztBQVNELE1BQU0sT0FBTyxzQkFBc0I7OEdBQXRCLHNCQUFzQjtrR0FBdEIsc0JBQXNCOzsyRkFBdEIsc0JBQXNCO2tCQU5sQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSx3REFBd0Q7b0JBQ2xFLElBQUksRUFBRTt3QkFDSixLQUFLLEVBQUUsMkJBQTJCO3FCQUNuQztpQkFDRjs7QUFTRCxNQUFNLE9BQU8sZ0JBQWdCOzhHQUFoQixnQkFBZ0I7a0dBQWhCLGdCQUFnQjs7MkZBQWhCLGdCQUFnQjtrQkFONUIsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsNENBQTRDO29CQUN0RCxJQUFJLEVBQUU7d0JBQ0osS0FBSyxFQUFFLHFCQUFxQjtxQkFDN0I7aUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChjKSAyMDI0IFZpbGxlIGRlIE1vbnRyZWFsLiBBbGwgcmlnaHRzIHJlc2VydmVkLlxuICogTGljZW5zZWQgdW5kZXIgdGhlIE1JVCBsaWNlbnNlLlxuICogU2VlIExJQ0VOU0UgZmlsZSBpbiB0aGUgcHJvamVjdCByb290IGZvciBmdWxsIGxpY2Vuc2UgaW5mb3JtYXRpb24uXG4gKi9cbmltcG9ydCB7IENvbXBvbmVudCwgRGlyZWN0aXZlLCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdiYW8tbGlzdC1pdGVtLCBbYmFvLWxpc3QtaXRlbV0nLFxuICB0ZW1wbGF0ZVVybDogJy4vbGlzdC1pdGVtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vbGlzdC5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdiYW8tbGlzdC1pdGVtJyxcbiAgICByb2xlOiAnbGlzdGl0ZW0nXG4gIH1cbn0pXG5leHBvcnQgY2xhc3MgQmFvTGlzdEl0ZW0ge31cblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnYmFvLWxpc3QsIFtiYW8tbGlzdF0nLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdiYW8tbGlzdCcsXG4gICAgcm9sZTogJ2xpc3QnXG4gIH1cbn0pXG5leHBvcnQgY2xhc3MgQmFvTGlzdCB7fVxuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdiYW8tbmF2LWxpc3QsIFtiYW8tbmF2LWxpc3RdJyxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnYmFvLWxpc3QnLFxuICAgIHJvbGU6ICduYXZpZ2F0aW9uJ1xuICB9XG59KVxuZXhwb3J0IGNsYXNzIEJhb05hdkxpc3Qge31cblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnYmFvLWxpc3QtaXRlbS1kZXNjcmlwdGlvbiwgW2Jhby1saXN0LWl0ZW0tZGVzY3JpcHRpb25dJyxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnYmFvLWxpc3QtaXRlbS1kZXNjcmlwdGlvbidcbiAgfVxufSlcbmV4cG9ydCBjbGFzcyBCYW9MaXN0SXRlbURlc2NyaXB0aW9uIHt9XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ2Jhby1saXN0LWl0ZW0tdGl0bGUsIFtiYW8tbGlzdC1pdGVtLXRpdGxlXScsXG4gIGhvc3Q6IHtcbiAgICBjbGFzczogJ2Jhby1saXN0LWl0ZW0tdGl0bGUnXG4gIH1cbn0pXG5leHBvcnQgY2xhc3MgQmFvTGlzdEl0ZW1UaXRsZSB7fVxuIiwiPGRpdiBjbGFzcz1cImJhby1saXN0LWl0ZW0taGVhZGVyXCI+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cImJhb0ljb25JdGVtVHlwZSwgW2Jhb0ljb25JdGVtVHlwZV1cIj48L25nLWNvbnRlbnQ+XG48L2Rpdj5cbjxkaXYgY2xhc3M9XCJiYW8tbGlzdC1pdGVtLWNvbnRlbnRcIj5cbiAgPGRpdiBjbGFzcz1cImJhby1saXN0LWl0ZW0tdGV4dFwiPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJiYW8tbGlzdC1pdGVtLXRhZ1wiPlxuICAgIDxuZy1jb250ZW50XG4gICAgICBzZWxlY3Q9XCJiYW8tdGFnLCBbYmFvLXRhZ10sIGJhb0ljb25UYWcsIFtiYW9JY29uVGFnXVwiXG4gICAgPjwvbmctY29udGVudD5cbiAgPC9kaXY+XG48L2Rpdj5cbjxkaXYgY2xhc3M9XCJiYW8tbGlzdC1pdGVtLWFjdGlvbnNcIj5cbiAgPG5nLWNvbnRlbnRcbiAgICBzZWxlY3Q9XCJiYW8tYnV0dG9uLCBbYmFvLWJ1dHRvbl0sIGJhby1kcm9wZG93bi1tZW51LCBbYmFvLWRyb3Bkb3duLW1lbnVdXCJcbiAgPlxuICA8L25nLWNvbnRlbnQ+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -1546,14 +1546,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
1546
1546
|
*/
|
|
1547
1547
|
class BaoListItem {
|
|
1548
1548
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoListItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1549
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoListItem, selector: "bao-list-item, [bao-list-item]", host: { attributes: { "role": "listitem" }, classAttribute: "bao-list-item" }, ngImport: i0, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1549
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoListItem, selector: "bao-list-item, [bao-list-item]", host: { attributes: { "role": "listitem" }, classAttribute: "bao-list-item" }, ngImport: i0, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n<div class=\"bao-list-item-actions\">\n <ng-content\n select=\"bao-button, [bao-button], bao-dropdown-menu, [bao-dropdown-menu]\"\n >\n </ng-content>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}.bao-list .bao-list-item>.bao-list-item-actions .bao-button{margin-left:2rem;margin-top:-.5rem}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1550
1550
|
}
|
|
1551
1551
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoListItem, decorators: [{
|
|
1552
1552
|
type: Component,
|
|
1553
1553
|
args: [{ selector: 'bao-list-item, [bao-list-item]', encapsulation: ViewEncapsulation.None, host: {
|
|
1554
1554
|
class: 'bao-list-item',
|
|
1555
1555
|
role: 'listitem'
|
|
1556
|
-
}, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}\n"] }]
|
|
1556
|
+
}, template: "<div class=\"bao-list-item-header\">\n <ng-content select=\"baoIconItemType, [baoIconItemType]\"></ng-content>\n</div>\n<div class=\"bao-list-item-content\">\n <div class=\"bao-list-item-text\">\n <ng-content></ng-content>\n </div>\n <div class=\"bao-list-item-tag\">\n <ng-content\n select=\"bao-tag, [bao-tag], baoIconTag, [baoIconTag]\"\n ></ng-content>\n </div>\n</div>\n<div class=\"bao-list-item-actions\">\n <ng-content\n select=\"bao-button, [bao-button], bao-dropdown-menu, [bao-dropdown-menu]\"\n >\n </ng-content>\n</div>\n", styles: [".bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-list{padding:0;margin:0}.bao-list>.bao-list-item:last-child{border-radius:.125rem;box-shadow:inset 0 .0625rem #ced4da,inset 0 -.0625rem #ced4da}.bao-list>a.bao-list-item{border-bottom:none}.bao-list>a.bao-list-item:focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#f8f9fa}.bao-list>a.bao-list-item:focus .bao-list-item-title{color:#097d6c}.bao-list>a.bao-list-item:hover{background-color:#f8f9fa}.bao-list>a.bao-list-item:hover .bao-list-item-text,.bao-list>a.bao-list-item:hover .bao-list-item-title{color:#097d6c}.bao-list .bao-list-item{display:flex;padding:1rem;background-color:#fff0;border-radius:.125rem .125rem 0rem 0rem;box-shadow:inset 0 .0625rem #ced4da}.bao-list .bao-list-item>.bao-list-item-header{align-self:flex-start;color:#adb2bd;line-height:0}.bao-list .bao-list-item>.bao-list-item-header .bao-icon{margin-right:1em}.bao-list .bao-list-item>.bao-list-item-content{display:flex;flex-grow:2}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:column}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content{flex-direction:row;justify-content:space-between}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text{display:flex;flex-direction:column;color:#212529;font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-title{font-weight:700;font-size:1rem;line-height:1.5rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{padding:0;margin:0}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>ul.bao-list-item-description{display:inline-flex;flex-wrap:wrap}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{color:#637381;margin-right:0 1rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{font-weight:400;font-size:.875rem;line-height:1.25rem;list-style-type:none}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description{display:block}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*{margin-bottom:.25rem}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>*:last-child{margin-bottom:0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li{display:inline-flex;align-items:center;margin-bottom:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:before{content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><circle cx='12' cy='12' r='2'/></svg>\");height:1rem;width:1rem;margin:0 .25rem;flex-shrink:0}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-text>.bao-list-item-description>li:first-child:before{content:none}}.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag{line-height:0}@media (min-width: 0){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:.5rem 0 0}}@media (min-width: 768px){.bao-list .bao-list-item>.bao-list-item-content>.bao-list-item-tag>*{margin:0 0 0 1rem}}.bao-list .bao-list-item>.bao-list-item-actions .bao-button{margin-left:2rem;margin-top:-.5rem}\n"] }]
|
|
1557
1557
|
}] });
|
|
1558
1558
|
class BaoList {
|
|
1559
1559
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
@@ -4081,16 +4081,20 @@ class BaoDropdownMenuComponent {
|
|
|
4081
4081
|
}
|
|
4082
4082
|
upKeyEvent() {
|
|
4083
4083
|
if (this.isOpen) {
|
|
4084
|
-
const index = isNaN(this._activeItemIndex) ?
|
|
4084
|
+
const index = isNaN(this._activeItemIndex) ? -1 : this._activeItemIndex;
|
|
4085
4085
|
const nextIndex = this.getNextActivableItemIndex(index, false);
|
|
4086
|
-
|
|
4086
|
+
if (nextIndex > -1) {
|
|
4087
|
+
this.focusNextItem(nextIndex);
|
|
4088
|
+
}
|
|
4087
4089
|
}
|
|
4088
4090
|
}
|
|
4089
4091
|
downKeyEvent() {
|
|
4090
4092
|
if (this.isOpen) {
|
|
4091
|
-
const index = isNaN(this._activeItemIndex) ?
|
|
4093
|
+
const index = isNaN(this._activeItemIndex) ? -1 : this._activeItemIndex;
|
|
4092
4094
|
const nextIndex = this.getNextActivableItemIndex(index, true);
|
|
4093
|
-
|
|
4095
|
+
if (nextIndex > -1) {
|
|
4096
|
+
this.focusNextItem(nextIndex);
|
|
4097
|
+
}
|
|
4094
4098
|
}
|
|
4095
4099
|
}
|
|
4096
4100
|
/** Prevents focus to be lost when TAB has reached end of menu */
|
|
@@ -4101,6 +4105,16 @@ class BaoDropdownMenuComponent {
|
|
|
4101
4105
|
}
|
|
4102
4106
|
}
|
|
4103
4107
|
}
|
|
4108
|
+
tabUpKeyEvent() {
|
|
4109
|
+
if (this.isOpen) {
|
|
4110
|
+
this._activeItemIndex = this._listItems.reduce((acc, element, index) => {
|
|
4111
|
+
if (element.nativeElement === document.activeElement) {
|
|
4112
|
+
acc = index;
|
|
4113
|
+
}
|
|
4114
|
+
return acc;
|
|
4115
|
+
}, -1);
|
|
4116
|
+
}
|
|
4117
|
+
}
|
|
4104
4118
|
/** Prevents focus to be lost when SHIFT + TAB has reached beginning of menu */
|
|
4105
4119
|
shiftTabKeyEvent() {
|
|
4106
4120
|
if (this.isOpen) {
|
|
@@ -4116,16 +4130,16 @@ class BaoDropdownMenuComponent {
|
|
|
4116
4130
|
ngAfterContentInit() {
|
|
4117
4131
|
this._listItems.forEach((item) => item.itemClicked.subscribe(() => this.isClosedByKeyEvent.emit()));
|
|
4118
4132
|
}
|
|
4119
|
-
focusFirstItem() {
|
|
4120
|
-
this._activeItemIndex = 0;
|
|
4121
|
-
this._listItems.first.nativeElement.focus();
|
|
4122
|
-
}
|
|
4123
4133
|
open() {
|
|
4124
4134
|
this.isOpen = true;
|
|
4125
4135
|
}
|
|
4126
4136
|
close() {
|
|
4127
4137
|
this.isOpen = false;
|
|
4128
4138
|
}
|
|
4139
|
+
focus() {
|
|
4140
|
+
this._activeItemIndex = -1;
|
|
4141
|
+
this._menuContent.nativeElement.focus();
|
|
4142
|
+
}
|
|
4129
4143
|
/** Move the aria-current attribute to new active page */
|
|
4130
4144
|
setNavigationAttribute(activePageElement) {
|
|
4131
4145
|
const previousActivePage = this._listItems.find((item) => {
|
|
@@ -4149,39 +4163,54 @@ class BaoDropdownMenuComponent {
|
|
|
4149
4163
|
* @param isBackward If recursive function is going backward looking for last activable item in list
|
|
4150
4164
|
* @returns Index of the next item that will receive focus
|
|
4151
4165
|
*/
|
|
4152
|
-
getNextActivableItemIndex(currentIndex, isDown
|
|
4153
|
-
|
|
4154
|
-
|
|
4155
|
-
|
|
4166
|
+
getNextActivableItemIndex(currentIndex, isDown) {
|
|
4167
|
+
const init = [];
|
|
4168
|
+
// Get all the activable indexes
|
|
4169
|
+
const activableIndexes = this._listItems.reduce((acc, element, index) => {
|
|
4170
|
+
if (!element.disabled) {
|
|
4171
|
+
acc = [...acc, index];
|
|
4156
4172
|
}
|
|
4157
|
-
|
|
4158
|
-
|
|
4159
|
-
|
|
4160
|
-
|
|
4161
|
-
|
|
4173
|
+
return acc;
|
|
4174
|
+
}, init);
|
|
4175
|
+
if (activableIndexes.length) {
|
|
4176
|
+
if (isDown) {
|
|
4177
|
+
// Select the first enabled element
|
|
4178
|
+
if (currentIndex === -1) {
|
|
4179
|
+
return activableIndexes[0];
|
|
4180
|
+
}
|
|
4181
|
+
// Select the only enabled element
|
|
4182
|
+
if (activableIndexes.length === 1) {
|
|
4183
|
+
return activableIndexes[0];
|
|
4184
|
+
}
|
|
4185
|
+
// Stay on the last enabled element
|
|
4186
|
+
if (currentIndex === activableIndexes[activableIndexes.length - 1]) {
|
|
4187
|
+
return currentIndex;
|
|
4188
|
+
}
|
|
4189
|
+
// Select the next enabled element
|
|
4190
|
+
return activableIndexes.find(index => index > currentIndex);
|
|
4162
4191
|
}
|
|
4163
|
-
|
|
4164
|
-
|
|
4165
|
-
|
|
4166
|
-
|
|
4167
|
-
|
|
4192
|
+
const isUp = !isDown;
|
|
4193
|
+
if (isUp) {
|
|
4194
|
+
// Do nothing whenever nothing is selected
|
|
4195
|
+
if (currentIndex === -1) {
|
|
4196
|
+
return currentIndex;
|
|
4197
|
+
}
|
|
4198
|
+
// Select the only enabled element
|
|
4199
|
+
if (activableIndexes.length === 1) {
|
|
4200
|
+
return activableIndexes[0];
|
|
4201
|
+
}
|
|
4202
|
+
// Stay on the first enabled element
|
|
4203
|
+
if (currentIndex === activableIndexes[0]) {
|
|
4204
|
+
return currentIndex;
|
|
4205
|
+
}
|
|
4206
|
+
// Select the above enabled element
|
|
4207
|
+
return activableIndexes.reverse().find(index => index < currentIndex);
|
|
4168
4208
|
}
|
|
4169
|
-
return
|
|
4209
|
+
return -1;
|
|
4170
4210
|
}
|
|
4171
|
-
return nextIndex;
|
|
4172
|
-
}
|
|
4173
|
-
/**
|
|
4174
|
-
* Finds if focus has reached end or beginning of list
|
|
4175
|
-
* @param currentIndex List item index which currently has focus
|
|
4176
|
-
* @param isDown Whether the navigation is going in the down direction or not
|
|
4177
|
-
* @returns Can focus move to next item or not
|
|
4178
|
-
*/
|
|
4179
|
-
canMove(currentIndex, isDown) {
|
|
4180
|
-
return !((currentIndex == 0 && !isDown) ||
|
|
4181
|
-
(currentIndex == this._listItems.length - 1 && isDown));
|
|
4182
4211
|
}
|
|
4183
4212
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4184
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuComponent, selector: "bao-dropdown-menu", outputs: { isOpenChange: "isOpenChange", isClosedByKeyEvent: "isClosedByKeyEvent" }, host: { listeners: { "window:keyup.arrowup": "upKeyEvent()", "window:keyup.arrowdown": "downKeyEvent()", "window:keydown.tab": "tabKeyEvent()", "window:keydown.shift.tab": "shiftTabKeyEvent()" }, properties: { "class.bao-overlay-transparent-backdrop": "isOpen===false", "class.bao-dropdown-menu-closed": "isOpen===false", "attr.aria-expanded": "isOpen" }, classAttribute: "bao-dropdown-menu-container" }, queries: [{ propertyName: "_listItems", predicate: BaoDropdownMenuItem, descendants: true }], viewQueries: [{ propertyName: "_menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4213
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuComponent, selector: "bao-dropdown-menu", outputs: { isOpenChange: "isOpenChange", isClosedByKeyEvent: "isClosedByKeyEvent" }, host: { listeners: { "window:keyup.arrowup": "upKeyEvent()", "window:keyup.arrowdown": "downKeyEvent()", "window:keydown.tab": "tabKeyEvent()", "window:keyup.tab": "tabUpKeyEvent()", "window:keydown.shift.tab": "shiftTabKeyEvent()" }, properties: { "class.bao-overlay-transparent-backdrop": "isOpen===false", "class.bao-dropdown-menu-closed": "isOpen===false", "attr.aria-expanded": "isOpen" }, classAttribute: "bao-dropdown-menu-container" }, queries: [{ propertyName: "_listItems", predicate: BaoDropdownMenuItem, descendants: true }], viewQueries: [{ propertyName: "_menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;margin-top:.25rem;margin-bottom:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu:focus-visible{outline:none}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4185
4214
|
}
|
|
4186
4215
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuComponent, decorators: [{
|
|
4187
4216
|
type: Component,
|
|
@@ -4190,7 +4219,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
4190
4219
|
'[class.bao-overlay-transparent-backdrop]': 'isOpen===false',
|
|
4191
4220
|
'[class.bao-dropdown-menu-closed]': 'isOpen===false',
|
|
4192
4221
|
'[attr.aria-expanded]': 'isOpen'
|
|
4193
|
-
}, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"] }]
|
|
4222
|
+
}, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;margin-top:.25rem;margin-bottom:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu:focus-visible{outline:none}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"] }]
|
|
4194
4223
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { isOpenChange: [{
|
|
4195
4224
|
type: Output
|
|
4196
4225
|
}], isClosedByKeyEvent: [{
|
|
@@ -4210,6 +4239,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
4210
4239
|
}], tabKeyEvent: [{
|
|
4211
4240
|
type: HostListener,
|
|
4212
4241
|
args: ['window:keydown.tab']
|
|
4242
|
+
}], tabUpKeyEvent: [{
|
|
4243
|
+
type: HostListener,
|
|
4244
|
+
args: ['window:keyup.tab']
|
|
4213
4245
|
}], shiftTabKeyEvent: [{
|
|
4214
4246
|
type: HostListener,
|
|
4215
4247
|
args: ['window:keydown.shift.tab']
|
|
@@ -4234,14 +4266,6 @@ class BaoDropdownMenuTrigger {
|
|
|
4234
4266
|
this.nativeElement.focus();
|
|
4235
4267
|
}
|
|
4236
4268
|
}
|
|
4237
|
-
/** Enter key event triggers click event which opens menu,
|
|
4238
|
-
* then focus is put on first item in the menu */
|
|
4239
|
-
enterKeyEvent(event) {
|
|
4240
|
-
if (this._isMenuOpen && document.activeElement === this.nativeElement) {
|
|
4241
|
-
event.stopImmediatePropagation();
|
|
4242
|
-
this.menu.focusFirstItem();
|
|
4243
|
-
}
|
|
4244
|
-
}
|
|
4245
4269
|
onClick() {
|
|
4246
4270
|
this.toggleMenu();
|
|
4247
4271
|
}
|
|
@@ -4276,6 +4300,7 @@ class BaoDropdownMenuTrigger {
|
|
|
4276
4300
|
overlayRef.attach(this.menu.menuPortal);
|
|
4277
4301
|
this._isMenuOpen = true;
|
|
4278
4302
|
this.menu.open();
|
|
4303
|
+
this.menu.focus();
|
|
4279
4304
|
}
|
|
4280
4305
|
createOverlay() {
|
|
4281
4306
|
if (!this._overlayRef) {
|
|
@@ -4330,7 +4355,7 @@ class BaoDropdownMenuTrigger {
|
|
|
4330
4355
|
});
|
|
4331
4356
|
}
|
|
4332
4357
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuTrigger, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1$4.Overlay }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4333
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuTrigger, selector: "bao-dropdown-menu-trigger, [bao-dropdown-menu-trigger], [baoDropdownMenuTriggerFor]", inputs: { menu: ["baoDropdownMenuTriggerFor", "menu"] }, host: { listeners: { "window:keyup.escape": "escapeKeyEvent()", "
|
|
4358
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuTrigger, selector: "bao-dropdown-menu-trigger, [bao-dropdown-menu-trigger], [baoDropdownMenuTriggerFor]", inputs: { menu: ["baoDropdownMenuTriggerFor", "menu"] }, host: { listeners: { "window:keyup.escape": "escapeKeyEvent()", "click": "onClick()" }, classAttribute: "bao-dropdown-menu-trigger" }, ngImport: i0 }); }
|
|
4334
4359
|
}
|
|
4335
4360
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuTrigger, decorators: [{
|
|
4336
4361
|
type: Directive,
|
|
@@ -4344,9 +4369,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
4344
4369
|
}], escapeKeyEvent: [{
|
|
4345
4370
|
type: HostListener,
|
|
4346
4371
|
args: ['window:keyup.escape']
|
|
4347
|
-
}], enterKeyEvent: [{
|
|
4348
|
-
type: HostListener,
|
|
4349
|
-
args: ['window:keyup.enter', ['$event']]
|
|
4350
4372
|
}], onClick: [{
|
|
4351
4373
|
type: HostListener,
|
|
4352
4374
|
args: ['click']
|
|
@@ -4494,6 +4516,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
|
|
|
4494
4516
|
const KILO_THRESHOLD = 1000;
|
|
4495
4517
|
const MEGA_THRESHOLD = 1000000;
|
|
4496
4518
|
class BaoFilePreviewComponent {
|
|
4519
|
+
/**
|
|
4520
|
+
* Uploaded file to display in list.
|
|
4521
|
+
*/
|
|
4522
|
+
set file(f) {
|
|
4523
|
+
this._file = f;
|
|
4524
|
+
this.setFileData();
|
|
4525
|
+
}
|
|
4497
4526
|
constructor(elementRef, renderer) {
|
|
4498
4527
|
this.elementRef = elementRef;
|
|
4499
4528
|
this.renderer = renderer;
|
|
@@ -4510,10 +4539,8 @@ class BaoFilePreviewComponent {
|
|
|
4510
4539
|
get nativeElement() {
|
|
4511
4540
|
return this.elementRef.nativeElement;
|
|
4512
4541
|
}
|
|
4513
|
-
|
|
4514
|
-
|
|
4515
|
-
}
|
|
4516
|
-
ngAfterContentInit() {
|
|
4542
|
+
setFileData() {
|
|
4543
|
+
this.formatSize(this._file.size);
|
|
4517
4544
|
this.getThumbnail();
|
|
4518
4545
|
this.setIcon();
|
|
4519
4546
|
}
|
|
@@ -4528,8 +4555,8 @@ class BaoFilePreviewComponent {
|
|
|
4528
4555
|
}
|
|
4529
4556
|
}
|
|
4530
4557
|
getThumbnail() {
|
|
4531
|
-
if (this.
|
|
4532
|
-
(this.
|
|
4558
|
+
if (this._file &&
|
|
4559
|
+
(this._file.type === 'image/png' || this._file.type === 'image/jpeg')) {
|
|
4533
4560
|
const reader = new FileReader();
|
|
4534
4561
|
reader.onload = (event) => {
|
|
4535
4562
|
this.thumbnailURL = event.target.result;
|
|
@@ -4537,31 +4564,33 @@ class BaoFilePreviewComponent {
|
|
|
4537
4564
|
reader.onerror = () => {
|
|
4538
4565
|
this.thumbnailURL = '';
|
|
4539
4566
|
};
|
|
4540
|
-
reader.readAsDataURL(this.
|
|
4567
|
+
reader.readAsDataURL(this._file);
|
|
4541
4568
|
}
|
|
4542
4569
|
}
|
|
4543
4570
|
formatSize(size) {
|
|
4544
4571
|
if (size >= KILO_THRESHOLD && size / KILO_THRESHOLD < KILO_THRESHOLD) {
|
|
4545
|
-
|
|
4572
|
+
this.fileSize = this.getSizeAndUnit(size, KILO_THRESHOLD, 'Ko');
|
|
4573
|
+
return;
|
|
4546
4574
|
}
|
|
4547
4575
|
const sizeDividedByKoMultiplicator = size / KILO_THRESHOLD;
|
|
4548
4576
|
if (sizeDividedByKoMultiplicator >= KILO_THRESHOLD) {
|
|
4549
4577
|
const toFixed = sizeDividedByKoMultiplicator > 10 ? 0 : 1;
|
|
4550
|
-
|
|
4578
|
+
this.fileSize = this.getSizeAndUnit(size, MEGA_THRESHOLD, 'Mo', toFixed);
|
|
4579
|
+
return;
|
|
4551
4580
|
}
|
|
4552
|
-
|
|
4581
|
+
this.fileSize = `${size} octets`;
|
|
4553
4582
|
}
|
|
4554
4583
|
getSizeAndUnit(size, multiplicator, unit, toFixed = 0) {
|
|
4555
4584
|
return `${(size / multiplicator).toFixed(toFixed)} ${unit}`;
|
|
4556
4585
|
}
|
|
4557
4586
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoFilePreviewComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4558
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoFilePreviewComponent, selector: "bao-file-preview, [bao-file-preview]", inputs: { file: "file", isLoading: "isLoading" }, host: { classAttribute: "bao-file-preview" }, ngImport: i0, template: "<div class=\"bao-file-info\">\n <ng-content select=\"bao-icon\"></ng-content>\n <bao-icon\n *ngIf=\"insertGenericIcon && !thumbnailURL\"\n class=\"bao-file-media\"\n svgIcon=\"icon-file\"\n >\n </bao-icon>\n <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n <img\n class=\"bao-file-media\"\n [src]=\"thumbnailURL\"\n width=\"40px\"\n height=\"40px\"\n />\n </ng-container>\n <div class=\"bao-file-text\">\n <div class=\"bao-file-name\">{{
|
|
4587
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoFilePreviewComponent, selector: "bao-file-preview, [bao-file-preview]", inputs: { file: "file", isLoading: "isLoading" }, host: { classAttribute: "bao-file-preview" }, ngImport: i0, template: "<div class=\"bao-file-info\">\n <ng-content select=\"bao-icon\"></ng-content>\n <bao-icon\n *ngIf=\"insertGenericIcon && !thumbnailURL\"\n class=\"bao-file-media\"\n svgIcon=\"icon-file\"\n >\n </bao-icon>\n <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n <img\n class=\"bao-file-media\"\n [src]=\"thumbnailURL\"\n width=\"40px\"\n height=\"40px\"\n />\n </ng-container>\n <div class=\"bao-file-text\">\n <div class=\"bao-file-name\">{{ _file.name }}</div>\n <div class=\"bao-file-size\">{{ fileSize }}</div>\n </div>\n</div>\n<ng-container *ngIf=\"!isLoading\">\n <ng-content select=\"button[bao-button]\"></ng-content>\n <ng-content select=\"baoDropdownTriggerFor\"></ng-content>\n</ng-container>\n<bao-icon\n *ngIf=\"isLoading\"\n class=\"loading-spinner\"\n svgIcon=\"icon-spinner\"\n title=\"chargement\"\n></bao-icon>\n", styles: [".bao-file-preview{display:flex;align-items:center;justify-content:space-between;padding-top:.625rem;padding-bottom:.625rem;list-style-type:none}.bao-file-preview>.bao-file-info{display:flex;align-items:center}.bao-file-preview>.bao-file-info>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-file-preview>.bao-file-info>.bao-file-media{margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text{display:inline-flex;flex-direction:column;margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-name{overflow:hidden;font-weight:700;font-size:.875rem;line-height:1.25rem;color:#212529}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-size{font-weight:400;font-size:.75rem;line-height:1rem;color:#637381}.bao-file-preview .loading-spinner{color:#097d6c}.bao-file-preview .bao-dropdown-menu-container{position:absolute;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BaoIconComponent, selector: "bao-icon", inputs: ["color", "size", "svgIcon", "title"], exportAs: ["baoIcon"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
4559
4588
|
}
|
|
4560
4589
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoFilePreviewComponent, decorators: [{
|
|
4561
4590
|
type: Component,
|
|
4562
4591
|
args: [{ selector: 'bao-file-preview, [bao-file-preview]', encapsulation: ViewEncapsulation.None, host: {
|
|
4563
4592
|
class: 'bao-file-preview'
|
|
4564
|
-
}, template: "<div class=\"bao-file-info\">\n <ng-content select=\"bao-icon\"></ng-content>\n <bao-icon\n *ngIf=\"insertGenericIcon && !thumbnailURL\"\n class=\"bao-file-media\"\n svgIcon=\"icon-file\"\n >\n </bao-icon>\n <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n <img\n class=\"bao-file-media\"\n [src]=\"thumbnailURL\"\n width=\"40px\"\n height=\"40px\"\n />\n </ng-container>\n <div class=\"bao-file-text\">\n <div class=\"bao-file-name\">{{
|
|
4593
|
+
}, template: "<div class=\"bao-file-info\">\n <ng-content select=\"bao-icon\"></ng-content>\n <bao-icon\n *ngIf=\"insertGenericIcon && !thumbnailURL\"\n class=\"bao-file-media\"\n svgIcon=\"icon-file\"\n >\n </bao-icon>\n <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n <img\n class=\"bao-file-media\"\n [src]=\"thumbnailURL\"\n width=\"40px\"\n height=\"40px\"\n />\n </ng-container>\n <div class=\"bao-file-text\">\n <div class=\"bao-file-name\">{{ _file.name }}</div>\n <div class=\"bao-file-size\">{{ fileSize }}</div>\n </div>\n</div>\n<ng-container *ngIf=\"!isLoading\">\n <ng-content select=\"button[bao-button]\"></ng-content>\n <ng-content select=\"baoDropdownTriggerFor\"></ng-content>\n</ng-container>\n<bao-icon\n *ngIf=\"isLoading\"\n class=\"loading-spinner\"\n svgIcon=\"icon-spinner\"\n title=\"chargement\"\n></bao-icon>\n", styles: [".bao-file-preview{display:flex;align-items:center;justify-content:space-between;padding-top:.625rem;padding-bottom:.625rem;list-style-type:none}.bao-file-preview>.bao-file-info{display:flex;align-items:center}.bao-file-preview>.bao-file-info>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-file-preview>.bao-file-info>.bao-file-media{margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text{display:inline-flex;flex-direction:column;margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-name{overflow:hidden;font-weight:700;font-size:.875rem;line-height:1.25rem;color:#212529}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-size{font-weight:400;font-size:.75rem;line-height:1rem;color:#637381}.bao-file-preview .loading-spinner{color:#097d6c}.bao-file-preview .bao-dropdown-menu-container{position:absolute;margin-left:auto}\n"] }]
|
|
4565
4594
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { file: [{
|
|
4566
4595
|
type: Input
|
|
4567
4596
|
}], isLoading: [{
|