@trendyol/baklava 2.4.0-beta.9 → 3.0.0-beta.10
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/README.md +3 -3
- package/dist/assets/badge.svg +5 -0
- package/dist/assets/express.svg +3 -0
- package/dist/assets/express_delivery.svg +6 -0
- package/dist/assets/express_furniture.svg +6 -0
- package/dist/assets/medal.svg +2 -10
- package/dist/assets/sorting_asc.svg +4 -0
- package/dist/assets/sorting_desc.svg +4 -0
- package/dist/assets/translation.svg +3 -0
- package/dist/baklava-react.d.ts +85 -27
- package/dist/baklava-react.d.ts.map +1 -1
- package/dist/baklava-react.js +1 -1
- package/dist/baklava-react.js.map +3 -3
- package/dist/baklava-vue.d.ts +7 -0
- package/dist/baklava.d.ts +7 -0
- package/dist/baklava.d.ts.map +1 -1
- package/dist/baklava.js +1 -1
- package/dist/{chunk-AVMAZXZT.js → chunk-3IQYFKUZ.js} +2 -2
- package/dist/{chunk-SLY6IY2R.js → chunk-3QXRSN5E.js} +2 -2
- package/dist/{chunk-XQUQIQBO.js → chunk-57IOXMBV.js} +2 -2
- package/dist/chunk-6DJUQN3S.js +2 -0
- package/dist/chunk-6DJUQN3S.js.map +7 -0
- package/dist/chunk-6FHZDUYQ.js +16 -0
- package/dist/chunk-6FHZDUYQ.js.map +7 -0
- package/dist/{chunk-EPFBV6RC.js → chunk-6H54TTNK.js} +3 -3
- package/dist/chunk-6H54TTNK.js.map +7 -0
- package/dist/chunk-BHKJL7XR.js +63 -0
- package/dist/chunk-BHKJL7XR.js.map +7 -0
- package/dist/chunk-DNSU2ZXO.js +2 -0
- package/dist/chunk-DNSU2ZXO.js.map +7 -0
- package/dist/{chunk-RQG2GHCK.js → chunk-DR4D2GMR.js} +2 -2
- package/dist/{chunk-MNNOI75G.js → chunk-FPDUGGJ5.js} +2 -2
- package/dist/chunk-HBMVE2VJ.js +26 -0
- package/dist/chunk-HBMVE2VJ.js.map +7 -0
- package/dist/chunk-HBPBDC7T.js +95 -0
- package/dist/chunk-HBPBDC7T.js.map +7 -0
- package/dist/chunk-HMDGICS5.js +2 -0
- package/dist/chunk-HMDGICS5.js.map +7 -0
- package/dist/{chunk-PCREGBBF.js → chunk-HSVSMABT.js} +2 -2
- package/dist/{chunk-X5MXYPRD.js → chunk-HULHLSIH.js} +2 -2
- package/dist/chunk-HZ6A5QFC.js +2 -0
- package/dist/chunk-HZ6A5QFC.js.map +7 -0
- package/dist/{chunk-FJTTJ5ZT.js → chunk-IU67AS3O.js} +2 -2
- package/dist/chunk-IZ2LK5GK.js +2 -0
- package/dist/{chunk-RFUZBNM4.js → chunk-JZ3S4JFA.js} +2 -2
- package/dist/chunk-K3IALLEI.js +2 -0
- package/dist/chunk-K3IALLEI.js.map +7 -0
- package/dist/{chunk-JI2OEPG2.js → chunk-L6BUT2FV.js} +2 -2
- package/dist/{chunk-6UTBN2XX.js → chunk-LYOZ36IH.js} +2 -2
- package/dist/{chunk-KR6AUZ77.js → chunk-MACM4RPG.js} +2 -2
- package/dist/chunk-MG23TBA3.js +18 -0
- package/dist/chunk-MG23TBA3.js.map +7 -0
- package/dist/chunk-O665PNJ6.js +33 -0
- package/dist/chunk-O665PNJ6.js.map +7 -0
- package/dist/{chunk-5EFPA3CA.js → chunk-PLUCMBSD.js} +5 -5
- package/dist/chunk-PLUCMBSD.js.map +7 -0
- package/dist/{chunk-WA7DDIST.js → chunk-Q7LYRUYQ.js} +2 -2
- package/dist/chunk-QXFCLEZB.js +16 -0
- package/dist/chunk-QXFCLEZB.js.map +7 -0
- package/dist/chunk-TI6K2YFV.js +11 -0
- package/dist/chunk-TI6K2YFV.js.map +7 -0
- package/dist/chunk-UERDT3VQ.js +50 -0
- package/dist/chunk-UERDT3VQ.js.map +7 -0
- package/dist/chunk-VZDVVGEO.js +110 -0
- package/dist/chunk-VZDVVGEO.js.map +7 -0
- package/dist/chunk-WJ2RNEDL.js +8 -0
- package/dist/chunk-WJ2RNEDL.js.map +7 -0
- package/dist/chunk-XDCNO7EY.js +2 -0
- package/dist/chunk-XDCNO7EY.js.map +7 -0
- package/dist/chunk-XDUIVR6I.js +2 -0
- package/dist/chunk-XDUIVR6I.js.map +7 -0
- package/dist/{chunk-LWG2UXQG.js → chunk-XLRX2X2I.js} +2 -2
- package/dist/{chunk-VOYAVKU3.js → chunk-YCHZB54C.js} +2 -2
- package/dist/{chunk-L4XYDFNG.js → chunk-YML6L24Q.js} +3 -3
- package/dist/{chunk-L4XYDFNG.js.map → chunk-YML6L24Q.js.map} +2 -2
- package/dist/components/alert/bl-alert.d.ts +1 -1
- package/dist/components/alert/bl-alert.d.ts.map +1 -1
- package/dist/components/alert/bl-alert.js +1 -1
- package/dist/components/badge/bl-badge.d.ts +1 -1
- package/dist/components/badge/bl-badge.d.ts.map +1 -1
- package/dist/components/badge/bl-badge.js +1 -1
- package/dist/components/button/bl-button.d.ts +4 -4
- package/dist/components/button/bl-button.d.ts.map +1 -1
- package/dist/components/button/bl-button.js +1 -1
- package/dist/components/checkbox-group/bl-checkbox-group.js +1 -1
- package/dist/components/checkbox-group/checkbox/bl-checkbox.js +1 -1
- package/dist/components/dialog/bl-dialog.d.ts.map +1 -1
- package/dist/components/dialog/bl-dialog.js +1 -1
- package/dist/components/dialog/bl-dialog.stories.d.ts +1 -1
- package/dist/components/dialog/bl-dialog.stories.d.ts.map +1 -1
- package/dist/components/dialog/bl-dialog.stories.js +1 -1
- package/dist/components/drawer/bl-drawer.d.ts +6 -0
- package/dist/components/drawer/bl-drawer.d.ts.map +1 -1
- package/dist/components/drawer/bl-drawer.js +1 -1
- package/dist/components/dropdown/bl-dropdown.d.ts.map +1 -1
- package/dist/components/dropdown/bl-dropdown.js +1 -1
- package/dist/components/dropdown/group/bl-dropdown-group.js +1 -1
- package/dist/components/dropdown/item/bl-dropdown-item.d.ts +1 -0
- package/dist/components/dropdown/item/bl-dropdown-item.d.ts.map +1 -1
- package/dist/components/dropdown/item/bl-dropdown-item.js +1 -1
- package/dist/components/icon/bl-icon.js +1 -1
- package/dist/components/icon/icon-list.d.ts +2 -2
- package/dist/components/icon/icon-list.d.ts.map +1 -1
- package/dist/components/icon/icon-list.js +1 -1
- package/dist/components/icon/icon-list.js.map +2 -2
- package/dist/components/input/bl-input.d.ts +2 -2
- package/dist/components/input/bl-input.d.ts.map +1 -1
- package/dist/components/input/bl-input.js +1 -1
- package/dist/components/notification/bl-notification.d.ts +3 -3
- package/dist/components/notification/bl-notification.d.ts.map +1 -1
- package/dist/components/notification/bl-notification.js +1 -1
- package/dist/components/notification/bl-notification.stories.d.ts +2 -2
- package/dist/components/notification/bl-notification.stories.d.ts.map +1 -1
- package/dist/components/notification/bl-notification.stories.js +1 -1
- package/dist/components/notification/bl-notification.stories.js.map +1 -1
- package/dist/components/notification/card/bl-notification-card.d.ts +1 -1
- package/dist/components/notification/card/bl-notification-card.d.ts.map +1 -1
- package/dist/components/notification/card/bl-notification-card.js +1 -1
- package/dist/components/pagination/bl-pagination.d.ts +2 -2
- package/dist/components/pagination/bl-pagination.d.ts.map +1 -1
- package/dist/components/pagination/bl-pagination.js +1 -1
- package/dist/components/popover/bl-popover.d.ts +2 -2
- package/dist/components/popover/bl-popover.d.ts.map +1 -1
- package/dist/components/popover/bl-popover.js +1 -1
- package/dist/components/progress-indicator/bl-progress-indicator.d.ts +1 -1
- package/dist/components/progress-indicator/bl-progress-indicator.d.ts.map +1 -1
- package/dist/components/progress-indicator/bl-progress-indicator.js +1 -1
- package/dist/components/radio-group/bl-radio-group.js +1 -1
- package/dist/components/radio-group/radio/bl-radio.js +1 -1
- package/dist/components/select/bl-select.d.ts +11 -9
- package/dist/components/select/bl-select.d.ts.map +1 -1
- package/dist/components/select/bl-select.js +1 -1
- package/dist/components/select/option/bl-select-option.d.ts +4 -0
- package/dist/components/select/option/bl-select-option.d.ts.map +1 -1
- package/dist/components/select/option/bl-select-option.js +1 -1
- package/dist/components/split-button/bl-split-button.d.ts +103 -0
- package/dist/components/split-button/bl-split-button.d.ts.map +1 -0
- package/dist/components/split-button/bl-split-button.js +2 -0
- package/dist/components/split-button/bl-split-button.js.map +7 -0
- package/dist/components/split-button/bl-split-button.test.d.ts +2 -0
- package/dist/components/split-button/bl-split-button.test.d.ts.map +1 -0
- package/dist/components/switch/bl-switch.d.ts.map +1 -1
- package/dist/components/switch/bl-switch.js +1 -1
- package/dist/components/tab-group/bl-tab-group.js +1 -1
- package/dist/components/tab-group/tab/bl-tab.js +1 -1
- package/dist/components/tab-group/tab-panel/bl-tab-panel.js +1 -1
- package/dist/components/table/bl-table.d.ts +120 -0
- package/dist/components/table/bl-table.d.ts.map +1 -0
- package/dist/components/table/bl-table.js +2 -0
- package/dist/components/table/bl-table.js.map +7 -0
- package/dist/components/table/bl-table.test.d.ts +6 -0
- package/dist/components/table/bl-table.test.d.ts.map +1 -0
- package/dist/components/table/table-body/bl-table-body.d.ts +19 -0
- package/dist/components/table/table-body/bl-table-body.d.ts.map +1 -0
- package/dist/components/table/table-body/bl-table-body.js +2 -0
- package/dist/components/table/table-body/bl-table-body.js.map +7 -0
- package/dist/components/table/table-body/bl-table-body.test.d.ts +2 -0
- package/dist/components/table/table-body/bl-table-body.test.d.ts.map +1 -0
- package/dist/components/table/table-cell/bl-table-cell.d.ts +35 -0
- package/dist/components/table/table-cell/bl-table-cell.d.ts.map +1 -0
- package/dist/components/table/table-cell/bl-table-cell.js +2 -0
- package/dist/components/table/table-cell/bl-table-cell.js.map +7 -0
- package/dist/components/table/table-cell/bl-table-cell.test.d.ts +2 -0
- package/dist/components/table/table-cell/bl-table-cell.test.d.ts.map +1 -0
- package/dist/components/table/table-header/bl-table-header.d.ts +22 -0
- package/dist/components/table/table-header/bl-table-header.d.ts.map +1 -0
- package/dist/components/table/table-header/bl-table-header.js +2 -0
- package/dist/components/table/table-header/bl-table-header.js.map +7 -0
- package/dist/components/table/table-header/bl-table-header.test.d.ts +2 -0
- package/dist/components/table/table-header/bl-table-header.test.d.ts.map +1 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.d.ts +43 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.d.ts.map +1 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.js +2 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.js.map +7 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.test.d.ts +2 -0
- package/dist/components/table/table-header-cell/bl-table-header-cell.test.d.ts.map +1 -0
- package/dist/components/table/table-row/bl-table-row.d.ts +31 -0
- package/dist/components/table/table-row/bl-table-row.d.ts.map +1 -0
- package/dist/components/table/table-row/bl-table-row.js +2 -0
- package/dist/components/table/table-row/bl-table-row.js.map +7 -0
- package/dist/components/table/table-row/bl-table-row.test.d.ts +2 -0
- package/dist/components/table/table-row/bl-table-row.test.d.ts.map +1 -0
- package/dist/components/textarea/bl-textarea.d.ts +1 -1
- package/dist/components/textarea/bl-textarea.d.ts.map +1 -1
- package/dist/components/textarea/bl-textarea.js +1 -1
- package/dist/components/tooltip/bl-tooltip.d.ts +1 -1
- package/dist/components/tooltip/bl-tooltip.d.ts.map +1 -1
- package/dist/components/tooltip/bl-tooltip.js +1 -1
- package/dist/custom-elements.json +824 -43
- package/dist/generated/locale-codes.d.ts +14 -0
- package/dist/generated/locale-codes.d.ts.map +1 -0
- package/dist/generated/locale-codes.js +2 -0
- package/dist/generated/locale-codes.js.map +7 -0
- package/dist/generated/locales/tr.d.ts +9 -0
- package/dist/generated/locales/tr.d.ts.map +1 -0
- package/dist/generated/locales/tr.js +2 -0
- package/dist/generated/locales/tr.js.map +7 -0
- package/dist/localization.d.ts +4 -0
- package/dist/localization.d.ts.map +1 -0
- package/dist/localization.js +2 -0
- package/dist/localization.js.map +7 -0
- package/dist/utilities/icon-mock.d.ts +1 -1
- package/dist/utilities/icon-mock.d.ts.map +1 -1
- package/dist/utilities/style-to-px-converter.test.d.ts +2 -0
- package/dist/utilities/style-to-px-converter.test.d.ts.map +1 -0
- package/dist/utilities/style-to-px.converter.d.ts +2 -0
- package/dist/utilities/style-to-px.converter.d.ts.map +1 -0
- package/package.json +11 -7
- package/dist/chunk-5EFPA3CA.js.map +0 -7
- package/dist/chunk-AMAOGVPQ.js +0 -106
- package/dist/chunk-AMAOGVPQ.js.map +0 -7
- package/dist/chunk-BNACGMP2.js +0 -16
- package/dist/chunk-BNACGMP2.js.map +0 -7
- package/dist/chunk-CYCIT2TG.js +0 -2
- package/dist/chunk-DJOD4BTL.js +0 -2
- package/dist/chunk-DJOD4BTL.js.map +0 -7
- package/dist/chunk-EPFBV6RC.js.map +0 -7
- package/dist/chunk-FSFO7DCO.js +0 -50
- package/dist/chunk-FSFO7DCO.js.map +0 -7
- package/dist/chunk-HJWQ7Y3K.js +0 -5
- package/dist/chunk-HJWQ7Y3K.js.map +0 -7
- package/dist/chunk-JPRCBAHY.js +0 -23
- package/dist/chunk-JPRCBAHY.js.map +0 -7
- package/dist/chunk-KXWP6EDU.js +0 -26
- package/dist/chunk-KXWP6EDU.js.map +0 -7
- package/dist/chunk-MPKYBU46.js +0 -33
- package/dist/chunk-MPKYBU46.js.map +0 -7
- /package/dist/{chunk-AVMAZXZT.js.map → chunk-3IQYFKUZ.js.map} +0 -0
- /package/dist/{chunk-SLY6IY2R.js.map → chunk-3QXRSN5E.js.map} +0 -0
- /package/dist/{chunk-XQUQIQBO.js.map → chunk-57IOXMBV.js.map} +0 -0
- /package/dist/{chunk-RQG2GHCK.js.map → chunk-DR4D2GMR.js.map} +0 -0
- /package/dist/{chunk-MNNOI75G.js.map → chunk-FPDUGGJ5.js.map} +0 -0
- /package/dist/{chunk-PCREGBBF.js.map → chunk-HSVSMABT.js.map} +0 -0
- /package/dist/{chunk-X5MXYPRD.js.map → chunk-HULHLSIH.js.map} +0 -0
- /package/dist/{chunk-FJTTJ5ZT.js.map → chunk-IU67AS3O.js.map} +0 -0
- /package/dist/{chunk-CYCIT2TG.js.map → chunk-IZ2LK5GK.js.map} +0 -0
- /package/dist/{chunk-RFUZBNM4.js.map → chunk-JZ3S4JFA.js.map} +0 -0
- /package/dist/{chunk-JI2OEPG2.js.map → chunk-L6BUT2FV.js.map} +0 -0
- /package/dist/{chunk-6UTBN2XX.js.map → chunk-LYOZ36IH.js.map} +0 -0
- /package/dist/{chunk-KR6AUZ77.js.map → chunk-MACM4RPG.js.map} +0 -0
- /package/dist/{chunk-WA7DDIST.js.map → chunk-Q7LYRUYQ.js.map} +0 -0
- /package/dist/{chunk-LWG2UXQG.js.map → chunk-XLRX2X2I.js.map} +0 -0
- /package/dist/{chunk-VOYAVKU3.js.map → chunk-YCHZB54C.js.map} +0 -0
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import{a as v,c as n}from"./chunk-HBPBDC7T.js";import{a as b}from"./chunk-DINNT5P2.js";import{a as d}from"./chunk-GRL4DWKG.js";import{a as h,b as i,c as m}from"./chunk-X2KXJYXQ.js";import{a as g,b as s,f as o}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var y=g`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:" \\B7 \\B7 \\B7";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`,P=y;var t=class extends o{constructor(){super(...arguments);this.currentPage=1;this.totalItems=0;this.itemsPerPage=10;this.hasJumper=!1;this.hasSelect=!1;this.itemsPerPageOptions=[{text:"10 Items",value:10},{text:"25 Items",value:25},{text:"50 Items",value:50},{text:"100 Items",value:100}];this.pages=[]}static get styles(){return[P]}connectedCallback(){super.connectedCallback(),setTimeout(()=>{window==null||window.addEventListener("resize",()=>this._paginate())})}disconnectedCallback(){super.disconnectedCallback(),window==null||window.removeEventListener("resize",this._paginate)}updated(e){(e.has("currentPage")||e.has("itemsPerPage")||e.has("totalItems"))&&this._paginate()}_paginate(){this.pages=[];let e=Math.ceil(Math.abs(this.totalItems/this.itemsPerPage))||1;if(e<=8){this.pages=Array.from(Array(e),(a,l)=>l+1);return}this.pages.push(1),this.currentPage<5?this.pages.push(2,3,4,5,"..."):this.currentPage>=5&&this.currentPage<=e-4?this.pages.push("...",this.currentPage-1,this.currentPage,this.currentPage+1,"..."):this.pages.push("...",e-4,e-3,e-2,e-1),this.pages.push(e)}_changePage(e){let a=this.currentPage;this.currentPage=e,this.onChange({selectedPage:e,prevPage:a,itemsPerPage:this.itemsPerPage})}_pageBack(){this.currentPage!==1&&this._changePage(this.currentPage-1)}_pageForward(){this.currentPage!==this._getLastPage()&&this._changePage(this.currentPage+1)}_getLastPage(){return+this.pages[this.pages.length-1]}_inputHandler(e){e.stopPropagation();let a=+e.target.value,l=a>0?Math.min(this._getLastPage(),a):1;this._changePage(l)}_selectHandler(e){var a;this.itemsPerPage=+((a=e==null?void 0:e.detail)==null?void 0:a.value)||100,this._changePage(1)}_renderSinglePage(e){if(typeof e=="string")return s`<li class="dots"></li>`;let a=this.currentPage===e?"page":void 0;return s` <li>
|
|
2
|
+
<bl-button
|
|
3
|
+
@click="${()=>this._changePage(e)}"
|
|
4
|
+
variant=${this.currentPage===e?"primary":"tertiary"}
|
|
5
|
+
kind="neutral"
|
|
6
|
+
label="Page ${e}"
|
|
7
|
+
aria-current=${b(a)}
|
|
8
|
+
>
|
|
9
|
+
${e}
|
|
10
|
+
</bl-button>
|
|
11
|
+
</li>`}renderPages(){return s`
|
|
12
|
+
<div class="page-container">
|
|
13
|
+
<bl-button
|
|
14
|
+
@click="${this._pageBack}"
|
|
15
|
+
variant="tertiary"
|
|
16
|
+
kind="neutral"
|
|
17
|
+
icon="arrow_left"
|
|
18
|
+
class="previous"
|
|
19
|
+
label="Previous"
|
|
20
|
+
?disabled=${this.currentPage===1}
|
|
21
|
+
></bl-button>
|
|
22
|
+
<ul class="page-list">
|
|
23
|
+
${window.innerWidth<768?s`${this._renderSinglePage(this.currentPage)}`:this.pages.map(e=>s`${this._renderSinglePage(e)}`)}
|
|
24
|
+
</ul>
|
|
25
|
+
<bl-button
|
|
26
|
+
@click="${this._pageForward}"
|
|
27
|
+
variant="tertiary"
|
|
28
|
+
kind="neutral"
|
|
29
|
+
icon="arrow_right"
|
|
30
|
+
class="next"
|
|
31
|
+
label="Next"
|
|
32
|
+
?disabled=${this.currentPage===this._getLastPage()}
|
|
33
|
+
></bl-button>
|
|
34
|
+
</div>
|
|
35
|
+
`}render(){var p,u;let e=(p=this.jumperLabel)!=null?p:n("Go to",{desc:"bl-pagination: jumper text"}),a=(u=this.selectLabel)!=null?u:n("Show",{desc:"bl-pagination: listing text"}),l=this.hasSelect?s`
|
|
36
|
+
<div class="select">
|
|
37
|
+
<label>${a}</label>
|
|
38
|
+
<bl-select @bl-select="${this._selectHandler}" .value=${this.itemsPerPage} required>
|
|
39
|
+
${this.itemsPerPageOptions.map(c=>s`<bl-select-option .value=${c.value}
|
|
40
|
+
>${c.text}</bl-select-option
|
|
41
|
+
>`)}
|
|
42
|
+
</bl-select>
|
|
43
|
+
</div>
|
|
44
|
+
`:null,f=this.hasJumper?s` <div class="jumper">
|
|
45
|
+
<label>${e}</label>
|
|
46
|
+
<bl-input .value="${this.currentPage}" @bl-change="${this._inputHandler}"></bl-input>
|
|
47
|
+
</div>`:null;return s` <nav class="pagination" aria-label="Pagination">
|
|
48
|
+
${(()=>{if(!(!this.hasSelect&&!this.hasJumper))return s` <div class="pagination-helpers">${l} ${f}</div> `})()} ${this.renderPages()}
|
|
49
|
+
</nav>`}};r([i({attribute:"current-page",type:Number,reflect:!0})],t.prototype,"currentPage",2),r([i({attribute:"total-items",type:Number})],t.prototype,"totalItems",2),r([i({attribute:"items-per-page",type:Number,reflect:!0})],t.prototype,"itemsPerPage",2),r([i({attribute:"has-jumper",type:Boolean})],t.prototype,"hasJumper",2),r([i({attribute:"jumper-label",type:String})],t.prototype,"jumperLabel",2),r([i({attribute:"has-select",type:Boolean})],t.prototype,"hasSelect",2),r([i({attribute:"select-label",type:String})],t.prototype,"selectLabel",2),r([i({type:Array,attribute:!1})],t.prototype,"itemsPerPageOptions",2),r([m()],t.prototype,"pages",2),r([d("bl-change")],t.prototype,"onChange",2),t=r([h("bl-pagination"),v()],t);export{t as a};
|
|
50
|
+
//# sourceMappingURL=chunk-UERDT3VQ.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/pagination/bl-pagination.css", "../src/components/pagination/bl-pagination.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`.pagination{display:flex;flex-wrap:wrap;justify-content:center;max-width:max-content;gap:var(--bl-size-s)}.pagination *{margin:0;padding:0;box-sizing:border-box}.page-container{display:flex;align-items:center}.page-list{display:flex;align-items:center;list-style:none;user-select:none;gap:var(--bl-size-3xs)}.dots{margin:0 var(--bl-size-2xs)}.dots::before{content:\" \\\\B7 \\\\B7 \\\\B7\";color:var(--bl-color-neutral-darker)}.pagination-helpers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--bl-size-m);color:var(--bl-color-neutral-darker)}.jumper,.select{display:flex;align-items:center;gap:var(--bl-size-2xs)}label{font:var(--bl-font-title-3-medium);font-size:var(--bl-font-size-m);font-weight:var(--bl-font-weight-medium);line-height:var(--bl-font-size-m);letter-spacing:0;user-select:none}bl-input{width:62px}bl-select{width:auto}@media only screen and (max-width: 768px){label{display:none}}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult, PropertyValues } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { localized, msg } from \"@lit/localize\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport \"../button/bl-button\";\nimport \"../input/bl-input\";\nimport \"../select/bl-select\";\nimport style from \"./bl-pagination.css\";\n\n/**\n * @tag bl-pagination\n * @summary Baklava Pagination component\n */\n\n@customElement(\"bl-pagination\")\n@localized()\nexport default class BlPagination extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Sets the current page\n */\n @property({ attribute: \"current-page\", type: Number, reflect: true })\n currentPage = 1;\n\n /**\n * Sets the total items to be paginated\n */\n @property({ attribute: \"total-items\", type: Number })\n totalItems = 0;\n\n /**\n * Sets the number of items per page\n */\n @property({ attribute: \"items-per-page\", type: Number, reflect: true })\n itemsPerPage = 10;\n\n /**\n * Adds jumper element if provided as true\n */\n @property({ attribute: \"has-jumper\", type: Boolean })\n hasJumper = false;\n\n /**\n * Sets the jumper label\n */\n @property({ attribute: \"jumper-label\", type: String })\n jumperLabel?: string;\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"has-select\", type: Boolean })\n hasSelect = false;\n\n /**\n * Adds select element to choose the items per page\n */\n @property({ attribute: \"select-label\", type: String })\n selectLabel?: string;\n\n /**\n * Sets the items per page options of the select element\n * PROPERTY\n */\n @property({ type: Array, attribute: false })\n itemsPerPageOptions = [\n {\n text: \"10 Items\",\n value: 10,\n },\n {\n text: \"25 Items\",\n value: 25,\n },\n {\n text: \"50 Items\",\n value: 50,\n },\n {\n text: \"100 Items\",\n value: 100,\n },\n ];\n\n @state() private pages: Array<number | string> = [];\n\n /**\n * Fires when the current page changes\n */\n @event(\"bl-change\") private onChange: EventDispatcher<{\n selectedPage: number;\n prevPage: number;\n itemsPerPage: number;\n }>;\n\n connectedCallback() {\n super.connectedCallback();\n\n setTimeout(() => {\n window?.addEventListener(\"resize\", () => this._paginate());\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n window?.removeEventListener(\"resize\", this._paginate);\n }\n\n updated(changedProperties: PropertyValues<this>) {\n if (\n changedProperties.has(\"currentPage\") ||\n changedProperties.has(\"itemsPerPage\") ||\n changedProperties.has(\"totalItems\")\n ) {\n this._paginate();\n }\n }\n\n private _paginate() {\n this.pages = [];\n const pageListLength = Math.ceil(Math.abs(this.totalItems / this.itemsPerPage)) || 1;\n\n if (pageListLength <= 8) {\n this.pages = Array.from(Array(pageListLength), (_, index) => index + 1);\n return;\n }\n\n this.pages.push(1);\n\n if (this.currentPage < 5) {\n this.pages.push(2, 3, 4, 5, \"...\");\n } else if (this.currentPage >= 5 && this.currentPage <= pageListLength - 4) {\n this.pages.push(\"...\", this.currentPage - 1, this.currentPage, this.currentPage + 1, \"...\");\n } else {\n this.pages.push(\n \"...\",\n pageListLength - 4,\n pageListLength - 3,\n pageListLength - 2,\n pageListLength - 1\n );\n }\n\n this.pages.push(pageListLength);\n }\n\n private _changePage(selectedPage: number): void {\n const prevPage = this.currentPage;\n\n this.currentPage = selectedPage;\n\n this.onChange({\n selectedPage,\n prevPage,\n itemsPerPage: this.itemsPerPage,\n });\n }\n\n private _pageBack(): void {\n if (this.currentPage === 1) return;\n this._changePage(this.currentPage - 1);\n }\n\n private _pageForward(): void {\n if (this.currentPage === this._getLastPage()) return;\n this._changePage(this.currentPage + 1);\n }\n\n private _getLastPage(): number {\n return +this.pages[this.pages.length - 1];\n }\n\n private _inputHandler(event: CustomEvent) {\n event.stopPropagation();\n const inputValue = +(event.target as HTMLInputElement).value;\n const newPage = inputValue > 0 ? Math.min(this._getLastPage(), inputValue) : 1;\n\n this._changePage(newPage);\n }\n\n private _selectHandler(event: CustomEvent) {\n this.itemsPerPage = +event?.detail?.value || 100;\n this._changePage(1);\n }\n\n private _renderSinglePage(page: number | string) {\n if (typeof page === \"string\") {\n return html`<li class=\"dots\"></li>`;\n }\n const ariaCurrent = this.currentPage === page ? \"page\" : undefined;\n\n return html` <li>\n <bl-button\n @click=\"${() => this._changePage(page)}\"\n variant=${this.currentPage === page ? \"primary\" : \"tertiary\"}\n kind=\"neutral\"\n label=\"Page ${page}\"\n aria-current=${ifDefined(ariaCurrent)}\n >\n ${page}\n </bl-button>\n </li>`;\n }\n\n private renderPages() {\n return html`\n <div class=\"page-container\">\n <bl-button\n @click=\"${this._pageBack}\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"arrow_left\"\n class=\"previous\"\n label=\"Previous\"\n ?disabled=${this.currentPage === 1}\n ></bl-button>\n <ul class=\"page-list\">\n ${window.innerWidth < 768\n ? html`${this._renderSinglePage(this.currentPage)}`\n : this.pages.map(page => html`${this._renderSinglePage(page)}`)}\n </ul>\n <bl-button\n @click=\"${this._pageForward}\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"arrow_right\"\n class=\"next\"\n label=\"Next\"\n ?disabled=${this.currentPage === this._getLastPage()}\n ></bl-button>\n </div>\n `;\n }\n\n render(): TemplateResult {\n const jumperText = this.jumperLabel ?? msg(\"Go to\", { desc: \"bl-pagination: jumper text\" });\n const selectText = this.selectLabel ?? msg(\"Show\", { desc: \"bl-pagination: listing text\" });\n\n const selectEl = this.hasSelect\n ? html`\n <div class=\"select\">\n <label>${selectText}</label>\n <bl-select @bl-select=\"${this._selectHandler}\" .value=${this.itemsPerPage} required>\n ${this.itemsPerPageOptions.map(option => {\n return html`<bl-select-option .value=${option.value}\n >${option.text}</bl-select-option\n >`;\n })}\n </bl-select>\n </div>\n `\n : null;\n\n const jumperEl = this.hasJumper\n ? html` <div class=\"jumper\">\n <label>${jumperText}</label>\n <bl-input .value=\"${this.currentPage}\" @bl-change=\"${this._inputHandler}\"></bl-input>\n </div>`\n : null;\n\n const getHelperElements = () => {\n if (!this.hasSelect && !this.hasJumper) return;\n return html` <div class=\"pagination-helpers\">${selectEl} ${jumperEl}</div> `;\n };\n\n return html` <nav class=\"pagination\" aria-label=\"Pagination\">\n ${getHelperElements()} ${this.renderPages()}\n </nav>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-pagination\": BlPagination;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styles", "i", "bl_pagination_default", "BlPagination", "s", "bl_pagination_default", "changedProperties", "pageListLength", "_", "index", "selectedPage", "prevPage", "event", "inputValue", "newPage", "_a", "page", "x", "ariaCurrent", "l", "_b", "jumperText", "msg", "selectText", "selectEl", "option", "jumperEl", "__decorateClass", "e", "t", "localized"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import{b as E,d as C,f as V,g as I,h as A}from"./chunk-EZSEQHRH.js";import{a as z}from"./chunk-3B64VOWB.js";import{a as $}from"./chunk-XDUIVR6I.js";import{a as k,c as u}from"./chunk-HBPBDC7T.js";import{a as y}from"./chunk-ECPWEUBG.js";import{a as f}from"./chunk-6LT7O7T2.js";import{a as m}from"./chunk-DINNT5P2.js";import{a as x}from"./chunk-GRL4DWKG.js";import{a as T,b as s,c as p,e as h,f as S}from"./chunk-X2KXJYXQ.js";import{a as w,b as n,f as g}from"./chunk-4OT5AMS5.js";import{d as i}from"./chunk-IZ2LK5GK.js";var R=w`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size="large"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size="small"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:", "}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:"";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`,L=R;var l=class extends $(g){constructor(){super(...arguments);this.size="medium";this.required=!1;this.disabled=!1;this.clearable=!1;this.multiple=!1;this.autofocus=!1;this.labelFixed=!1;this.viewSelectAll=!1;this.searchBar=!1;this.searchBarLoadingState=!1;this._isPopoverOpen=!1;this._additionalSelectedOptionCount=0;this._searchText="";this._connectedOptions=[];this._cleanUpPopover=null;this._selectedOptions=[];this.dirty=!1;this._interactOutsideHandler=e=>{var o;let t=e.composedPath();(o=t==null?void 0:t.find(a=>a.tagName==="BL-SELECT"))!=null&&o.contains(this)||this.close()};this.focusedOptionIndex=-1}static get styles(){return[L]}get value(){return this._value}set value(e){if(this._value=e,Array.isArray(e)){let t=new FormData;e.forEach(o=>t.append(this.name,`${o}`)),this.setValue(t)}else this.setValue(e);this.setOptionsSelected()}shouldFormValueUpdate(){return this.value!==null&&this.value!==""}setOptionsSelected(){this._connectedOptions.forEach(e=>e.selected=this.value===e.value||Array.isArray(this.value)&&this.value.includes(e.value)),this._selectedOptions=[...this.options.filter(e=>e.selected)]}get options(){return this._connectedOptions}get opened(){return this._isPopoverOpen}get noResultFound(){return this._searchText!==""&&this._connectedOptions.every(e=>e.hidden)}get selectedOptions(){return this._selectedOptions}get additionalSelectedOptionCount(){return this._additionalSelectedOptionCount}validityCallback(){if(this.customInvalidText)return this.customInvalidText;let e=document.createElement("select");return e.required=this.required,e.validationMessage}reportValidity(){return this.dirty=!0,this.checkValidity()}resetFormControl(){this.value=this._initialValue}open(){this.searchBar&&setTimeout(()=>{var e,t,o;(o=(t=(e=document.activeElement)==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("input"))==null||o.focus()},100),this._isPopoverOpen=!0,this._setupPopover(),document.addEventListener("click",this._interactOutsideHandler,!0),document.addEventListener("focus",this._interactOutsideHandler,!0)}close(){this._handleSearchOptions({target:{value:""}}),this._isPopoverOpen=!1,this.focusedOptionIndex=-1,this._cleanUpPopover&&this._cleanUpPopover(),document.removeEventListener("click",this._interactOutsideHandler,!0),document.removeEventListener("focus",this._interactOutsideHandler,!0)}_setupPopover(){this._cleanUpPopover=I(this._selectInput,this._popover,()=>{A(this._selectInput,this._popover,{placement:"bottom",strategy:"fixed",middleware:[E(),C(8),V({apply(e){Object.assign(e.elements.floating.style,{width:`${e.elements.reference.getBoundingClientRect().width}px`})}})]}).then(({x:e,y:t})=>{this._popover.style.setProperty("--left",`${e}px`),this._popover.style.setProperty("--top",`${t}px`)})})}connectedCallback(){var e;super.connectedCallback(),(e=this.form)==null||e.addEventListener("submit",t=>{this.reportValidity()||t.preventDefault()})}disconnectedCallback(){super.disconnectedCallback(),this._cleanUpPopover&&this._cleanUpPopover()}inputTemplate(){var O;let e=n`<ul class="selected-options">
|
|
2
|
+
${this._selectedOptions.map(b=>n`<li>${b.getAttribute("label")||b.textContent}</li>`)}
|
|
3
|
+
</ul>`,o=!(this._selectedOptions.length>0&&this._selectedOptions.every(b=>b.disabled))&&(this.clearable||this.multiple),a=o?n`<bl-button
|
|
4
|
+
class="remove-all"
|
|
5
|
+
size="small"
|
|
6
|
+
variant="tertiary"
|
|
7
|
+
kind="neutral"
|
|
8
|
+
icon="close"
|
|
9
|
+
@click=${this._onClickRemove}
|
|
10
|
+
></bl-button>`:"",d=this.searchBar&&this.opened,c=this._selectedOptions.length>0,r=d||c&&o,v=(O=this.searchBarPlaceholder)!=null?O:u("Search",{desc:"bl-select: search placeholder text"}),M=n`<bl-icon
|
|
11
|
+
class="search-mag-icon"
|
|
12
|
+
name="search"
|
|
13
|
+
style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
|
|
14
|
+
></bl-icon>`,P=n`<bl-icon
|
|
15
|
+
class="search-loading-icon"
|
|
16
|
+
name="loading"
|
|
17
|
+
style="color: var(--bl-color-primary);font-size: var(--bl-font-size-s)"
|
|
18
|
+
></bl-icon>`,_=r?n`<div class="action-divider"></div>`:"",D=n`<fieldset
|
|
19
|
+
class=${f({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
|
|
20
|
+
tabindex="${this.disabled?"-1":0}"
|
|
21
|
+
.autofocus=${this.autofocus}
|
|
22
|
+
role="button"
|
|
23
|
+
aria-haspopup="listbox"
|
|
24
|
+
aria-expanded="${this.opened}"
|
|
25
|
+
aria-labelledby="label"
|
|
26
|
+
@click=${this.open}
|
|
27
|
+
>
|
|
28
|
+
<legend><span>${this.label}</span></legend>
|
|
29
|
+
|
|
30
|
+
${this._selectedOptions.length>0&&!this.opened?e:n`
|
|
31
|
+
<input
|
|
32
|
+
class="search-bar-input"
|
|
33
|
+
placeholder=${v}
|
|
34
|
+
@input=${this._handleSearchOptions}
|
|
35
|
+
.value=${this._searchText}
|
|
36
|
+
/>
|
|
37
|
+
`}
|
|
38
|
+
${this.opened?"":n`<span class="additional-selection-count"
|
|
39
|
+
>+${this._additionalSelectedOptionCount}</span
|
|
40
|
+
>`}
|
|
41
|
+
|
|
42
|
+
<div class="actions">
|
|
43
|
+
${this.opened?this.searchBarLoadingState?P:M:""}
|
|
44
|
+
${this.opened?"":a} ${_}
|
|
45
|
+
|
|
46
|
+
<div @click=${this._togglePopover}>
|
|
47
|
+
<bl-icon class="dropdown-icon open" name="arrow_up"></bl-icon>
|
|
48
|
+
|
|
49
|
+
<bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
|
|
50
|
+
</div>
|
|
51
|
+
</div>
|
|
52
|
+
</fieldset>`;return this.searchBar?D:n`<fieldset
|
|
53
|
+
class=${f({"select-input":!0,"has-overflowed-options":this._additionalSelectedOptionCount>0})}
|
|
54
|
+
tabindex="${m(this.disabled?void 0:0)}"
|
|
55
|
+
?autofocus=${this.autofocus}
|
|
56
|
+
@click=${this._togglePopover}
|
|
57
|
+
role="button"
|
|
58
|
+
aria-haspopup="listbox"
|
|
59
|
+
aria-expanded="${this.opened}"
|
|
60
|
+
aria-labelledby="label"
|
|
61
|
+
>
|
|
62
|
+
<legend><span>${this.label}</span></legend>
|
|
63
|
+
<span class="placeholder">${this.placeholder}</span>
|
|
64
|
+
<span class="label">${this.label}</span>
|
|
65
|
+
${e}
|
|
66
|
+
<span class="additional-selection-count">+${this._additionalSelectedOptionCount}</span>
|
|
67
|
+
<div class="actions">
|
|
68
|
+
${a} ${_}
|
|
69
|
+
<bl-icon class="dropdown-icon open" name="arrow_up"></bl-icon>
|
|
70
|
+
|
|
71
|
+
<bl-icon class="dropdown-icon closed" name="arrow_down"></bl-icon>
|
|
72
|
+
</div>
|
|
73
|
+
</fieldset>`}selectAllTemplate(){var a;if(!this.multiple||!this.viewSelectAll||this.noResultFound)return null;let e=this._connectedOptions.filter(d=>!d.hidden).every(d=>d.selected),t=this._selectedOptions.filter(d=>!d.hidden).length>0,o=(a=this.selectAllText)!=null?a:u("Select All",{desc:"bl-select: select all text"});return n`<bl-checkbox
|
|
74
|
+
class="select-all"
|
|
75
|
+
.checked="${e}"
|
|
76
|
+
.indeterminate="${t&&!e}"
|
|
77
|
+
role="option"
|
|
78
|
+
aria-selected="${e}"
|
|
79
|
+
@bl-checkbox-change="${this._handleSelectAll}"
|
|
80
|
+
>
|
|
81
|
+
${o}
|
|
82
|
+
</bl-checkbox>`}render(){var c,r;let e=this.checkValidity()?"":n`<p id="errorMessage" aria-live="polite" class="invalid-text">
|
|
83
|
+
${this.validationMessage}
|
|
84
|
+
</p>`,t=this.helpText?n`<p class="help-text">${this.helpText}</p>`:"",o=this.label?n`<label id="label">${this.label}</label>`:"",a=(c=this.searchNotFoundText)!=null?c:u("No Data Found",{desc:"bl-select: search no data text"}),d=(r=this.popoverClearSearchText)!=null?r:u("Clear Search",{desc:"bl-select: clear search button text"});return n`<div
|
|
85
|
+
class=${f({"select-wrapper":!0,"select-open":this.opened,selected:this._selectedOptions.length>0,invalid:!this.validity.valid,dirty:this.dirty})}
|
|
86
|
+
@keydown=${this.handleKeydown}
|
|
87
|
+
>
|
|
88
|
+
${o} ${this.inputTemplate()}
|
|
89
|
+
${this.options.length>0?n` <div
|
|
90
|
+
class="popover"
|
|
91
|
+
tabindex="${m(this._isPopoverOpen?void 0:"-1")}"
|
|
92
|
+
@bl-select-option=${this._handleSelectOptionEvent}
|
|
93
|
+
role="listbox"
|
|
94
|
+
aria-multiselectable="${this.multiple}"
|
|
95
|
+
aria-labelledby="label"
|
|
96
|
+
>
|
|
97
|
+
${this.selectAllTemplate()}
|
|
98
|
+
<slot></slot>
|
|
99
|
+
${this.searchBar&&this.noResultFound?n`<div name="popover-clear-search-text" class="popover-no-result">
|
|
100
|
+
<span>${a}</span>
|
|
101
|
+
<bl-button
|
|
102
|
+
variant="tertiary"
|
|
103
|
+
@click=${()=>{this._handleSearchOptions({target:{value:""}})}}
|
|
104
|
+
>${d}</bl-button
|
|
105
|
+
>
|
|
106
|
+
</div>`:""}
|
|
107
|
+
</div>`:""}
|
|
108
|
+
<div class="hint">${e} ${t}</div>
|
|
109
|
+
</div> `}handleKeydown(e){this.focusedOptionIndex===-1&&["Enter","Space"].includes(e.code)?(this._togglePopover(),e.preventDefault()):this._isPopoverOpen===!1&&["ArrowDown","ArrowUp"].includes(e.code)?(this.open(),e.preventDefault()):e.code==="Escape"?(this.close(),e.preventDefault()):this._isPopoverOpen&&["ArrowDown","ArrowUp"].includes(e.code)&&(e.code==="ArrowDown"&&this.focusedOptionIndex++,e.code==="ArrowUp"&&this.focusedOptionIndex--,this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.options.length-1)),this.options[this.focusedOptionIndex].focus(),e.preventDefault())}_togglePopover(){this._isPopoverOpen?this.close():this.open()}_handleSelectEvent(){let e=this._selectedOptions.map(t=>({value:t.value,selected:t.selected,text:t.textContent}));this.multiple?this._onBlSelect(e):this._onBlSelect(e[0])}_handleSearchEvent(){this._onBlSearch(this._searchText)}_handleSearchOptions(e){this.searchBar&&(this._searchText=e.target.value,this._handleSearchEvent(),this._connectedOptions.forEach(t=>{var a;let o=(a=t.textContent)==null?void 0:a.toLowerCase().includes(this._searchText.toLowerCase());t.hidden=!o}),this._selectedOptions=this.options.filter(t=>t.selected),this._handleLastVisibleSearchedOption(),this.requestUpdate())}_handleLastVisibleSearchedOption(){var t,o;let e=[...this.options].reverse().find(a=>!a.hidden);e&&((o=(t=e==null?void 0:e.shadowRoot)==null?void 0:t.querySelector("div"))==null||o.classList.add("no-border-bottom")),this.options.map(a=>{var d,c;!a.hidden&&a!==e&&((c=(d=a.shadowRoot)==null?void 0:d.querySelector("div"))==null||c.classList.remove("no-border-bottom"))})}_handleSingleSelect(e){this.value=e.value,this._handleSelectEvent(),this._isPopoverOpen=!1}_handleMultipleSelect(){this.value=this._connectedOptions.filter(e=>e.selected).map(e=>e.value),this._handleSelectEvent()}_handleSelectOptionEvent(e){let t=e.target;this.dirty=!0,this.multiple?this._handleMultipleSelect():this._handleSingleSelect(t)}_handleSelectAll(e){var c;let t=(c=this.shadowRoot)==null?void 0:c.querySelector(".select-all"),o=e.detail,d=this._connectedOptions.filter(r=>!r.selected&&!r.hidden).every(r=>r.disabled);if(o&&d){setTimeout(()=>{var v;let r=(v=t==null?void 0:t.shadowRoot)==null?void 0:v.querySelector("input");r==null||r.click()},0);return}this._connectedOptions.forEach(r=>{r.disabled||r.hidden||(r.selected=o)}),this._handleMultipleSelect()}_onClickRemove(e){e.stopPropagation();let t=this._selectedOptions.filter(o=>o.disabled);this._connectedOptions.filter(o=>!o.disabled&&o.selected).forEach(o=>{o.selected=!1}),this.value=t.length?t.map(o=>o.value):null,this._handleSelectEvent()}_checkAdditionalItemCount(){if(!this.multiple||!this.selectedOptionsItems||this.selectedOptionsItems.length<2){this._additionalSelectedOptionCount=0;return}let e=[...this.selectedOptionsItems].findIndex(t=>t.offsetLeft>this.selectedOptionsContainer.offsetWidth);e>-1?this._additionalSelectedOptionCount=this.selectedOptionsItems.length-e:this._additionalSelectedOptionCount=0}firstUpdated(){this.value===void 0&&(this.multiple?this.value=[]:this.value=null),this._initialValue=this._value}updated(e){e.has("multiple")&&typeof e.get("multiple")=="boolean"&&(this.value=null),e.has("_selectedOptions")&&this._checkAdditionalItemCount()}registerOption(e){this._connectedOptions.push(e),e.selected&&(this.multiple?(Array.isArray(this.value)||(this.value=[]),this.value=[...this.value,e.value]):this.value=e.value),this.setOptionsSelected(),this.requestUpdate()}unregisterOption(e){this._connectedOptions.splice(this._connectedOptions.indexOf(e),1)}};l.shadowRootOptions={...g.shadowRootOptions,delegatesFocus:!0},l.formControlValidators=[z],i([s()],l.prototype,"name",2),i([s()],l.prototype,"value",1),i([s({reflect:!0})],l.prototype,"label",2),i([s({reflect:!0})],l.prototype,"placeholder",2),i([s({type:String,reflect:!0})],l.prototype,"size",2),i([s({type:Boolean,reflect:!0})],l.prototype,"required",2),i([s({type:Boolean,reflect:!0})],l.prototype,"disabled",2),i([s({type:Boolean,reflect:!0})],l.prototype,"clearable",2),i([s({type:Boolean,reflect:!0})],l.prototype,"multiple",2),i([s({type:Boolean,reflect:!0})],l.prototype,"autofocus",2),i([s({type:Boolean,attribute:"label-fixed",reflect:!0})],l.prototype,"labelFixed",2),i([s({type:String,attribute:"help-text",reflect:!0})],l.prototype,"helpText",2),i([s({type:String,attribute:"invalid-text",reflect:!0})],l.prototype,"customInvalidText",2),i([s({type:Boolean,attribute:"view-select-all",converter:y()})],l.prototype,"viewSelectAll",2),i([s({type:String,attribute:"select-all-text"})],l.prototype,"selectAllText",2),i([s({type:Boolean,attribute:"search-bar",reflect:!0})],l.prototype,"searchBar",2),i([s({type:String,attribute:"search-bar-placeholder",reflect:!0})],l.prototype,"searchBarPlaceholder",2),i([s({type:Boolean,attribute:"search-bar-loading-state",converter:y()})],l.prototype,"searchBarLoadingState",2),i([s({type:String,attribute:"search-not-found-text",reflect:!0})],l.prototype,"searchNotFoundText",2),i([s({type:String,attribute:"popover-clear-search-text",reflect:!0})],l.prototype,"popoverClearSearchText",2),i([p()],l.prototype,"_isPopoverOpen",2),i([p()],l.prototype,"_additionalSelectedOptionCount",2),i([p()],l.prototype,"_searchText",2),i([h(".selected-options")],l.prototype,"selectedOptionsContainer",2),i([S(".selected-options li")],l.prototype,"selectedOptionsItems",2),i([h(".popover")],l.prototype,"_popover",2),i([h(".select-input")],l.prototype,"_selectInput",2),i([x("bl-select")],l.prototype,"_onBlSelect",2),i([x("bl-search")],l.prototype,"_onBlSearch",2),i([p()],l.prototype,"_selectedOptions",2),i([p()],l.prototype,"dirty",2),i([h(".select-input")],l.prototype,"validationTarget",2),l=i([T("bl-select"),k()],l);export{l as a};
|
|
110
|
+
//# sourceMappingURL=chunk-VZDVVGEO.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/select/bl-select.css", "../src/components/select/bl-select.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:200px;display:inline-block}.select-wrapper{width:100%;position:relative;display:grid;gap:var(--bl-size-3xs);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-xs);--label-padding:var(--bl-size-3xs);--border-size:1px;--background-color:var(--bl-color-neutral-full);--border-color:var(--bl-color-neutral-lighter);--border-focus-color:var(--bl-color-primary-highlight);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--label-color:var(--bl-color-neutral-dark);--placeholder-color:var(--bl-color-neutral-light);--height:var(--bl-size-2xl);--menu-padding:0 var(--bl-size-m);--menu-margin-top:var(--bl-size-2xs);--font-size:var(--bl-font-size-m);--disabled-color:var(--bl-color-neutral-lightest);--menu-height:250px;--popover-position:var(--bl-popover-position, fixed)}:host([multiple][view-select-all]) .select-wrapper{--menu-height:290px}:host([size=\"large\"]) .select-wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m)}:host([size=\"small\"]) .select-wrapper{--height:var(--bl-size-xl);--padding-vertical:var(--bl-size-3xs);--padding-horizontal:var(--bl-size-xs);--font-size:var(--bl-font-size-s)}:host([disabled]) .select-wrapper{--placeholder-color:var(--bl-color-neutral-light)}.dirty.invalid{--border-color:var(--bl-color-danger);--border-focus-color:var(--bl-color-danger-highlight);--label-color:var(--bl-color-danger)}.select-input{display:grid;align-items:center;justify-content:space-between;grid-template-columns:1fr max-content max-content;cursor:pointer;box-sizing:border-box;height:var(--height);border:solid 1px var(--border-color);font:var(--bl-font-title-3-regular);padding:0 calc(var(--padding-horizontal) - var(--label-padding) - var(--border-size));border-radius:var(--bl-border-radius-s);color:var(--text-color);background-color:var(--background-color);/* stylelint-disable-next-line property-no-vendor-prefix */-webkit-user-select:none;user-select:none;margin:0;width:auto;min-width:100%}.label,.placeholder{color:var(--placeholder-color);padding-left:var(--label-padding);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}:host(:not([placeholder])) .placeholder,.select-wrapper.selected .placeholder,:host([label]:not([label-fixed])) .select-wrapper:not(.select-open) .placeholder{display:none}:host([label-fixed]) .label,:host(:not([label])) .label{display:none}.remove-all{display:none}.selected .remove-all{display:block}:host([disabled]) .remove-all,:host([disabled]) .remove-all::after{display:none}.dropdown-icon{font-size:var(--bl-font-size-m)}.dropdown-icon.open{display:none}.select-open .dropdown-icon.open{display:inline-block}.select-open .dropdown-icon.closed{display:none}.selected .dropdown-icon{--icon-color:var(--bl-color-neutral-darker)}:host([disabled]) .dropdown-icon{--icon-color:var(--bl-color-neutral-light)}.select-open .select-input,.select-input:focus-visible{border:solid 1px var(--border-focus-color);outline:none}:host([disabled]){cursor:not-allowed}:host([disabled]) .select-input{pointer-events:none;background-color:var(--disabled-color)}.select-input .selected-options{padding:0;padding-left:var(--label-padding);margin:0;list-style:none;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .select-input .selected-options{color:var(--bl-color-neutral-light)}.selected-options li{display:inline;font-size:var(--font-size);color:var(--text-color)}.selected-options li:not(:last-child)::after{content:\", \"}.select-input:not(.has-overflowed-options) .additional-selection-count{display:none}:host([disabled]) .additional-selection-count{color:var(--bl-color-neutral-light)}:host([disabled]) .selected-options li{color:var(--bl-color-neutral-light)}.select-input .actions{display:flex;align-items:center;justify-content:center;gap:var(--bl-size-4xs);margin-left:var(--bl-size-2xs)}.popover{--left:0;--top:0;position:var(--popover-position);border:solid 1px var(--border-color);background-color:var(--background-color);font:var(--bl-font-title-3-regular);border-radius:var(--bl-border-radius-s);padding:var(--menu-padding);outline:none;box-sizing:border-box;max-height:var(--menu-height);overflow-y:auto;display:none;flex-direction:column;z-index:var(--bl-index-popover);width:100%;top:var(--top);left:var(--left)}.popover-no-result{display:flex;flex-direction:column;gap:var(--bl-size-2xs);align-items:center;justify-content:center;height:80px}.select-open .popover{display:flex;border:solid 1px var(--border-focus-color)}bl-icon{color:var(--icon-color)}legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;display:block;top:var(--padding-vertical);left:var(--padding-horizontal);right:calc(var(--bl-size-2xs) + var(--bl-size-m) + var(--bl-size-2xs));transition:all ease-in 0.1s;pointer-events:none;opacity:0;font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--placeholder-color)}legend{height:0;visibility:hidden;display:none}legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}:host([placeholder]) :where(.select-open, .selected) .label,:host(:not([placeholder])) .selected .label{display:none}:where(.select-open, .selected) label{top:0;transform:translateY(-50%);font:var(--bl-font-caption);color:var(--label-color);pointer-events:initial;right:var(--padding-horizontal);opacity:1}:host([label]) :where(.select-open, .selected) legend{max-width:100%;font:var(--bl-font-caption);display:block}:host([label-fixed]) label{position:static;padding:0;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--label-color);opacity:1}:host([label-fixed]) legend{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}.select-open .help-text,.select-open .invalid-text{visibility:hidden}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.select-all{position:sticky;top:0;padding:var(--bl-size-xs) 0;background:var(--background-color);z-index:1;font:var(--bl-font-title-3-regular);/* Make sure option focus doesn't overflow */box-shadow:10px 0 0 var(--background-color),-10px 0 0 var(--background-color)}.select-all::after{position:absolute;content:\"\";width:100%;bottom:0;border-bottom:1px solid var(--bl-color-neutral-lighter)}.search-bar-input{font:var(--bl-font-title-3-regular);font-size:var(--font-size);color:var(--text-color);border:none;outline:none;background-color:transparent;width:100%;height:100%;padding:0;margin:0;box-sizing:border-box}.search-bar-input::placeholder{color:var(--placeholder-color)}.search-bar-input:focus-visible{outline:none}.search-loading-icon{animation:spin 1s linear infinite}.action-divider{display:none}.select-wrapper .action-divider{display:block;height:1rem;width:1px;background-color:var(--bl-color-neutral-lighter)}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.actions bl-icon{padding:4px}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, query, queryAll, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { autoUpdate, computePosition, flip, MiddlewareState, offset, size } from \"@floating-ui/dom\";\nimport { msg, localized } from \"@lit/localize\";\nimport { FormControlMixin, requiredValidator } from \"@open-wc/form-control\";\nimport { FormValue } from \"@open-wc/form-helpers\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport { stringBooleanConverter } from \"../../utilities/string-boolean.converter\";\nimport \"../button/bl-button\";\nimport BlCheckbox from \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../checkbox-group/checkbox/bl-checkbox\";\nimport \"../icon/bl-icon\";\nimport style from \"../select/bl-select.css\";\nimport \"../select/option/bl-select-option\";\nimport type BlSelectOption from \"./option/bl-select-option\";\n\nexport interface ISelectOption<T = string> {\n value: T;\n text: string;\n selected: boolean;\n}\n\nexport type SelectSize = \"medium\" | \"large\" | \"small\";\n\nexport type CleanUpFunction = () => void;\n\n/**\n * @tag bl-select\n * @summary Baklava Select component\n *\n * @cssproperty [--bl-popover-position=fixed] Sets the positioning strategy of select popover. You can set it as `absolute` if you need to show popover relative to its trigger element.\n */\n@customElement(\"bl-select\")\n@localized()\nexport default class BlSelect<ValueType extends FormValue = string> extends FormControlMixin(\n LitElement\n) {\n static get styles(): CSSResultGroup {\n return [style];\n }\n static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n static formControlValidators = [requiredValidator];\n\n /**\n * Sets name of the select field\n */\n @property()\n name: string;\n\n private _value: ValueType | ValueType[] | null;\n\n private _initialValue: ValueType | ValueType[] | null;\n\n /**\n * Sets the value of the select\n */\n @property()\n get value(): ValueType | ValueType[] | null {\n return this._value;\n }\n\n set value(val: ValueType | ValueType[] | null) {\n this._value = val;\n\n if (Array.isArray(val)) {\n const formData = new FormData();\n\n val.forEach(option => formData.append(this.name, `${option}`));\n this.setValue(formData);\n } else {\n this.setValue(val);\n }\n\n this.setOptionsSelected();\n }\n\n shouldFormValueUpdate(): boolean {\n return this.value !== null && this.value !== \"\";\n }\n\n /* Declare reactive properties */\n /**\n * Sets the label value\n */\n @property({ reflect: true })\n label?: string;\n\n /**\n * Sets the placeholder value. If left blank, the label value (if specified) is set as placeholder.\n */\n @property({ reflect: true })\n placeholder?: string;\n\n /**\n * Sets the size value. Select component's height value will be changed accordingly\n */\n @property({ type: String, reflect: true })\n size: SelectSize = \"medium\";\n\n /**\n * When option is not selected, shows component in error state\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Shows the component in disabled state.\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Sets whether the selected option is clearable\n */\n @property({ type: Boolean, reflect: true })\n clearable = false;\n\n /**\n * Allows multiple options to be selected\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Sets input to get keyboard focus automatically\n */\n @property({ type: Boolean, reflect: true })\n autofocus = false;\n\n /**\n * Makes label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n\n /**\n * Adds help text\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText?: string;\n\n /**\n * Set custom error message\n */\n @property({ type: String, attribute: \"invalid-text\", reflect: true })\n customInvalidText?: string;\n\n /**\n * Views select all option in multiple select\n */\n @property({ type: Boolean, attribute: \"view-select-all\", converter: stringBooleanConverter() })\n viewSelectAll = false;\n\n /**\n * Sets select all text in multiple select\n */\n @property({ type: String, attribute: \"select-all-text\" })\n selectAllText?: string;\n\n /**\n * Enable search functionality for the options within the list\n */\n @property({ type: Boolean, attribute: \"search-bar\", reflect: true })\n searchBar = false;\n\n /**\n * Search for text variations such as \"search,\" \"searching,\" \"search by country,\" and so on\n */\n @property({ type: String, attribute: \"search-bar-placeholder\", reflect: true })\n searchBarPlaceholder?: string;\n\n /**\n * Display a loading icon in place of the search icon.\n */\n @property({\n type: Boolean,\n attribute: \"search-bar-loading-state\",\n converter: stringBooleanConverter(),\n })\n searchBarLoadingState = false;\n\n /**\n * Text to display when no search results are found.\n */\n @property({ type: String, attribute: \"search-not-found-text\", reflect: true })\n searchNotFoundText?: string;\n\n /**\n * Text to display on the clear search button.\n */\n @property({ type: String, attribute: \"popover-clear-search-text\", reflect: true })\n popoverClearSearchText?: string;\n\n /* Declare internal reactive properties */\n @state()\n private _isPopoverOpen = false;\n\n @state()\n private _additionalSelectedOptionCount = 0;\n\n @state()\n private _searchText = \"\";\n\n @query(\".selected-options\")\n private selectedOptionsContainer!: HTMLElement;\n\n @queryAll(\".selected-options li\")\n private selectedOptionsItems!: NodeListOf<HTMLElement>;\n\n @query(\".popover\")\n private _popover: HTMLElement;\n\n @query(\".select-input\")\n private _selectInput: HTMLElement;\n\n /**\n * Fires when selection changes\n */\n @event(\"bl-select\") private _onBlSelect: EventDispatcher<\n ISelectOption<ValueType>[] | ISelectOption<ValueType>\n >;\n\n /**\n * Fires when search text changes\n */\n @event(\"bl-search\") private _onBlSearch: EventDispatcher<string>;\n\n private _connectedOptions: BlSelectOption<ValueType>[] = [];\n\n private _cleanUpPopover: CleanUpFunction | null = null;\n\n private setOptionsSelected() {\n this._connectedOptions.forEach(\n option =>\n (option.selected =\n this.value === option.value ||\n (Array.isArray(this.value) && this.value.includes(option.value)))\n );\n\n this._selectedOptions = [...this.options.filter(option => option.selected)];\n }\n\n get options() {\n return this._connectedOptions;\n }\n\n get opened() {\n return this._isPopoverOpen;\n }\n\n get noResultFound() {\n return this._searchText !== \"\" && this._connectedOptions.every(option => option.hidden);\n }\n\n @state()\n private _selectedOptions: BlSelectOption<ValueType>[] = [];\n\n @state()\n private dirty = false;\n\n get selectedOptions(): BlSelectOption<ValueType>[] {\n return this._selectedOptions;\n }\n\n get additionalSelectedOptionCount() {\n return this._additionalSelectedOptionCount;\n }\n\n validityCallback(): string | void {\n if (this.customInvalidText) {\n return this.customInvalidText;\n }\n const select = document.createElement(\"select\");\n\n select.required = this.required;\n\n return select.validationMessage;\n }\n\n reportValidity() {\n this.dirty = true;\n return this.checkValidity();\n }\n\n resetFormControl(): void {\n this.value = this._initialValue;\n }\n\n @query(\".select-input\")\n validationTarget: HTMLElement;\n\n open() {\n if (this.searchBar) {\n setTimeout(() => {\n document.activeElement?.shadowRoot?.querySelector(\"input\")?.focus();\n }, 100);\n }\n\n this._isPopoverOpen = true;\n this._setupPopover();\n document.addEventListener(\"click\", this._interactOutsideHandler, true);\n document.addEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n close() {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n\n this._isPopoverOpen = false;\n this.focusedOptionIndex = -1;\n this._cleanUpPopover && this._cleanUpPopover();\n document.removeEventListener(\"click\", this._interactOutsideHandler, true);\n document.removeEventListener(\"focus\", this._interactOutsideHandler, true);\n }\n\n private _interactOutsideHandler = (event: MouseEvent | FocusEvent) => {\n const eventPath = event.composedPath() as HTMLElement[];\n\n if (!eventPath?.find(el => el.tagName === \"BL-SELECT\")?.contains(this)) {\n this.close();\n }\n };\n\n private _setupPopover() {\n this._cleanUpPopover = autoUpdate(this._selectInput, this._popover, () => {\n computePosition(this._selectInput, this._popover, {\n placement: \"bottom\",\n strategy: \"fixed\",\n middleware: [\n flip(),\n offset(8),\n size({\n apply(args: MiddlewareState) {\n Object.assign(args.elements.floating.style, {\n width: `${args.elements.reference.getBoundingClientRect().width}px`,\n });\n },\n }),\n ],\n }).then(({ x, y }) => {\n this._popover.style.setProperty(\"--left\", `${x}px`);\n this._popover.style.setProperty(\"--top\", `${y}px`);\n });\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.form?.addEventListener(\"submit\", (e: SubmitEvent) => {\n if (!this.reportValidity()) {\n e.preventDefault();\n }\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n\n this._cleanUpPopover && this._cleanUpPopover();\n }\n\n private inputTemplate() {\n const inputSelectedOptions = html`<ul class=\"selected-options\">\n ${this._selectedOptions.map(\n item => html`<li>${item.getAttribute(\"label\") || item.textContent}</li>`\n )}\n </ul>`;\n\n const isAllSelectedDisabled =\n this._selectedOptions.length > 0 && this._selectedOptions.every(option => option.disabled);\n const isRemoveButtonShown = !isAllSelectedDisabled && (this.clearable || this.multiple);\n const removeButton = isRemoveButtonShown\n ? html`<bl-button\n class=\"remove-all\"\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this._onClickRemove}\n ></bl-button>`\n : \"\";\n\n const isSearchBarVisible = this.searchBar && this.opened;\n const hasSelectedOptions = this._selectedOptions.length > 0;\n\n const isDividerShown = isSearchBarVisible || (hasSelectedOptions && isRemoveButtonShown);\n\n const searchbarPlaceholderText =\n this.searchBarPlaceholder ?? msg(\"Search\", { desc: \"bl-select: search placeholder text\" });\n\n const searchMagIcon = html`<bl-icon\n class=\"search-mag-icon\"\n name=\"search\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const searchLoadingIcon = html`<bl-icon\n class=\"search-loading-icon\"\n name=\"loading\"\n style=\"color: var(--bl-color-primary);font-size: var(--bl-font-size-s)\"\n ></bl-icon>`;\n\n const actionDivider = isDividerShown ? html`<div class=\"action-divider\"></div>` : \"\";\n\n const search = html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${this.disabled ? \"-1\" : 0}\"\n .autofocus=${this.autofocus}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n @click=${this.open}\n >\n <legend><span>${this.label}</span></legend>\n\n ${this._selectedOptions.length > 0 && !this.opened\n ? inputSelectedOptions\n : html`\n <input\n class=\"search-bar-input\"\n placeholder=${searchbarPlaceholderText}\n @input=${this._handleSearchOptions}\n .value=${this._searchText}\n />\n `}\n ${!this.opened\n ? html`<span class=\"additional-selection-count\"\n >+${this._additionalSelectedOptionCount}</span\n >`\n : \"\"}\n\n <div class=\"actions\">\n ${this.opened ? (this.searchBarLoadingState ? searchLoadingIcon : searchMagIcon) : \"\"}\n ${!this.opened ? removeButton : \"\"} ${actionDivider}\n\n <div @click=${this._togglePopover}>\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </div>\n </fieldset>`;\n\n return this.searchBar\n ? search\n : html`<fieldset\n class=${classMap({\n \"select-input\": true,\n \"has-overflowed-options\": this._additionalSelectedOptionCount > 0,\n })}\n tabindex=\"${ifDefined(this.disabled ? undefined : 0)}\"\n ?autofocus=${this.autofocus}\n @click=${this._togglePopover}\n role=\"button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"${this.opened}\"\n aria-labelledby=\"label\"\n >\n <legend><span>${this.label}</span></legend>\n <span class=\"placeholder\">${this.placeholder}</span>\n <span class=\"label\">${this.label}</span>\n ${inputSelectedOptions}\n <span class=\"additional-selection-count\">+${this._additionalSelectedOptionCount}</span>\n <div class=\"actions\">\n ${removeButton} ${actionDivider}\n <bl-icon class=\"dropdown-icon open\" name=\"arrow_up\"></bl-icon>\n\n <bl-icon class=\"dropdown-icon closed\" name=\"arrow_down\"></bl-icon>\n </div>\n </fieldset>`;\n }\n\n selectAllTemplate() {\n if (!this.multiple || !this.viewSelectAll || this.noResultFound) {\n return null;\n }\n\n const isAllRenderedOptionsSelected = this._connectedOptions\n .filter(option => !option.hidden)\n .every(option => option.selected);\n\n const isAnySelected = this._selectedOptions.filter(option => !option.hidden).length > 0;\n const selectAllText =\n this.selectAllText ?? msg(\"Select All\", { desc: \"bl-select: select all text\" });\n\n return html`<bl-checkbox\n class=\"select-all\"\n .checked=\"${isAllRenderedOptionsSelected}\"\n .indeterminate=\"${isAnySelected && !isAllRenderedOptionsSelected}\"\n role=\"option\"\n aria-selected=\"${isAllRenderedOptionsSelected}\"\n @bl-checkbox-change=\"${this._handleSelectAll}\"\n >\n ${selectAllText}\n </bl-checkbox>`;\n }\n\n render(): TemplateResult {\n const invalidMessage = !this.checkValidity()\n ? html`<p id=\"errorMessage\" aria-live=\"polite\" class=\"invalid-text\">\n ${this.validationMessage}\n </p>`\n : \"\";\n\n const helpMessage = this.helpText ? html`<p class=\"help-text\">${this.helpText}</p>` : \"\";\n\n const label = this.label ? html`<label id=\"label\">${this.label}</label>` : \"\";\n\n const noDataText =\n this.searchNotFoundText ?? msg(\"No Data Found\", { desc: \"bl-select: search no data text\" });\n\n const clearSearchText =\n this.popoverClearSearchText ??\n msg(\"Clear Search\", { desc: \"bl-select: clear search button text\" });\n\n return html`<div\n class=${classMap({\n \"select-wrapper\": true,\n \"select-open\": this.opened,\n \"selected\": this._selectedOptions.length > 0,\n \"invalid\": !this.validity.valid,\n \"dirty\": this.dirty,\n })}\n @keydown=${this.handleKeydown}\n >\n ${label} ${this.inputTemplate()}\n ${this.options.length > 0\n ? html` <div\n class=\"popover\"\n tabindex=\"${ifDefined(this._isPopoverOpen ? undefined : \"-1\")}\"\n @bl-select-option=${this._handleSelectOptionEvent}\n role=\"listbox\"\n aria-multiselectable=\"${this.multiple}\"\n aria-labelledby=\"label\"\n >\n ${this.selectAllTemplate()}\n <slot></slot>\n ${this.searchBar && this.noResultFound\n ? html`<div name=\"popover-clear-search-text\" class=\"popover-no-result\">\n <span>${noDataText}</span>\n <bl-button\n variant=\"tertiary\"\n @click=${() => {\n this._handleSearchOptions({ target: { value: \"\" } } as InputEvent & {\n target: HTMLInputElement;\n });\n }}\n >${clearSearchText}</bl-button\n >\n </div>`\n : \"\"}\n </div>`\n : \"\"}\n <div class=\"hint\">${invalidMessage} ${helpMessage}</div>\n </div> `;\n }\n\n private focusedOptionIndex = -1;\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.focusedOptionIndex === -1 && [\"Enter\", \"Space\"].includes(event.code)) {\n this._togglePopover();\n event.preventDefault();\n } else if (this._isPopoverOpen === false && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n this.open();\n event.preventDefault();\n } else if (event.code === \"Escape\") {\n this.close();\n event.preventDefault();\n } else if (this._isPopoverOpen && [\"ArrowDown\", \"ArrowUp\"].includes(event.code)) {\n event.code === \"ArrowDown\" && this.focusedOptionIndex++;\n event.code === \"ArrowUp\" && this.focusedOptionIndex--;\n\n // Don't exceed array indexes\n this.focusedOptionIndex = Math.max(\n 0,\n Math.min(this.focusedOptionIndex, this.options.length - 1)\n );\n\n this.options[this.focusedOptionIndex].focus();\n\n event.preventDefault();\n }\n }\n\n private _togglePopover() {\n this._isPopoverOpen ? this.close() : this.open();\n }\n\n private _handleSelectEvent() {\n const options = this._selectedOptions.map(\n option =>\n ({\n value: option.value,\n selected: option.selected,\n text: option.textContent,\n } as ISelectOption<ValueType>)\n );\n\n if (!this.multiple) this._onBlSelect(options[0]);\n else this._onBlSelect(options);\n }\n\n private _handleSearchEvent() {\n this._onBlSearch(this._searchText);\n }\n\n private _handleSearchOptions(e: InputEvent): void {\n if (!this.searchBar) return;\n\n this._searchText = (e.target as HTMLInputElement).value;\n\n this._handleSearchEvent();\n\n this._connectedOptions.forEach(option => {\n const isVisible = option.textContent?.toLowerCase().includes(this._searchText.toLowerCase());\n\n option.hidden = !isVisible;\n });\n\n this._selectedOptions = this.options.filter(option => option.selected);\n\n this._handleLastVisibleSearchedOption();\n\n this.requestUpdate();\n }\n\n private _handleLastVisibleSearchedOption() {\n const lastVisibleOption = [...this.options].reverse().find(option => !option.hidden);\n\n if (lastVisibleOption) {\n lastVisibleOption?.shadowRoot?.querySelector(\"div\")?.classList.add(\"no-border-bottom\");\n }\n\n this.options.map(option => {\n if (!option.hidden && option !== lastVisibleOption) {\n option.shadowRoot?.querySelector(\"div\")?.classList.remove(\"no-border-bottom\");\n }\n });\n }\n\n private _handleSingleSelect(optionItem: BlSelectOption<ValueType>) {\n this.value = optionItem.value;\n\n this._handleSelectEvent();\n this._isPopoverOpen = false;\n }\n\n private _handleMultipleSelect() {\n this.value = this._connectedOptions\n .filter(option => option.selected)\n .map(option => option.value);\n\n this._handleSelectEvent();\n }\n\n private _handleSelectOptionEvent(e: CustomEvent) {\n const optionItem = e.target as BlSelectOption<ValueType>;\n\n this.dirty = true;\n\n if (this.multiple) {\n this._handleMultipleSelect();\n } else {\n this._handleSingleSelect(optionItem);\n }\n }\n\n private _handleSelectAll(e: CustomEvent) {\n const selectAllEl = this.shadowRoot?.querySelector(\".select-all\") as BlCheckbox;\n\n const checked = e.detail;\n const unselectedOptions = this._connectedOptions.filter(\n option => !option.selected && !option.hidden\n );\n const isAllUnselectedDisabled = unselectedOptions.every(option => option.disabled);\n\n // If all available options are selected, instead of checking, uncheck all options\n if (checked && isAllUnselectedDisabled) {\n setTimeout(() => {\n const checkbox = selectAllEl?.shadowRoot?.querySelector(\"input\");\n\n checkbox?.click();\n }, 0);\n return;\n }\n\n this._connectedOptions.forEach(option => {\n if (option.disabled || option.hidden) {\n return;\n }\n\n option.selected = checked;\n });\n\n this._handleMultipleSelect();\n }\n\n private _onClickRemove(e: MouseEvent) {\n e.stopPropagation();\n\n const selectedDisabledOptions = this._selectedOptions.filter(option => option.disabled);\n\n this._connectedOptions\n .filter(option => !option.disabled && option.selected)\n .forEach(option => {\n option.selected = false;\n });\n\n this.value = selectedDisabledOptions.length\n ? selectedDisabledOptions.map(option => option.value)\n : null;\n this._handleSelectEvent();\n }\n\n private _checkAdditionalItemCount() {\n if (!this.multiple || !this.selectedOptionsItems || this.selectedOptionsItems.length < 2) {\n this._additionalSelectedOptionCount = 0;\n return;\n }\n\n const firstNonVisibleItemIndex = [...this.selectedOptionsItems].findIndex(\n item => item.offsetLeft > this.selectedOptionsContainer.offsetWidth\n );\n\n if (firstNonVisibleItemIndex > -1) {\n this._additionalSelectedOptionCount =\n this.selectedOptionsItems.length - firstNonVisibleItemIndex;\n } else {\n this._additionalSelectedOptionCount = 0;\n }\n }\n\n protected firstUpdated(): void {\n if (this.value === undefined) {\n if (this.multiple) {\n this.value = [];\n } else {\n this.value = null;\n }\n }\n\n this._initialValue = this._value;\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (\n _changedProperties.has(\"multiple\") &&\n typeof _changedProperties.get(\"multiple\") === \"boolean\"\n ) {\n this.value = null;\n }\n\n if (_changedProperties.has(\"_selectedOptions\")) {\n this._checkAdditionalItemCount();\n }\n }\n\n /**\n * This method is used by `bl-select-option` component to register itself to bl-select.\n * @param option BlSelectOption reference to be registered\n */\n registerOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.push(option);\n\n if (option.selected) {\n if (this.multiple) {\n if (!Array.isArray(this.value)) {\n this.value = [];\n }\n this.value = [...this.value, option.value];\n } else {\n this.value = option.value;\n }\n }\n\n this.setOptionsSelected();\n this.requestUpdate();\n }\n\n /**\n * This method is used by `bl-select-option` component to unregister itself from bl-select.\n * @param option BlSelectOption reference to be unregistered\n */\n unregisterOption(option: BlSelectOption<ValueType>) {\n this._connectedOptions.splice(this._connectedOptions.indexOf(option), 1);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"bl-select\": BlSelect;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styles", "i", "bl_select_default", "BlSelect", "FormControlMixin", "s", "event", "_a", "eventPath", "el", "bl_select_default", "val", "formData", "option", "select", "_b", "_c", "autoUpdate", "computePosition", "flip", "offset", "size", "args", "x", "y", "e", "inputSelectedOptions", "item", "isRemoveButtonShown", "removeButton", "isSearchBarVisible", "hasSelectedOptions", "isDividerShown", "searchbarPlaceholderText", "msg", "searchMagIcon", "searchLoadingIcon", "actionDivider", "search", "o", "l", "isAllRenderedOptionsSelected", "isAnySelected", "selectAllText", "invalidMessage", "helpMessage", "label", "noDataText", "clearSearchText", "options", "isVisible", "lastVisibleOption", "optionItem", "selectAllEl", "checked", "isAllUnselectedDisabled", "checkbox", "selectedDisabledOptions", "firstNonVisibleItemIndex", "_changedProperties", "requiredValidator", "__decorateClass", "stringBooleanConverter", "t", "i", "localized"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import{a}from"./chunk-GRL4DWKG.js";import{a as u,b as s,c as o}from"./chunk-X2KXJYXQ.js";import{a as n,b as c,f as h}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var p=n`:host{display:block;height:100%}.table-wrapper{overflow:auto;border:1px solid var(--bl-color-neutral-lighter);border-radius:var(--bl-size-3xs);position:relative;max-height:100%}.table{width:100%;display:table;border-spacing:0}`,d=p;var b="bl-table",m="bl-sort",y="bl-row-select",t=class extends h{constructor(){super(...arguments);this.selectable=!1;this.multiple=!1;this.sortable=!1;this.stickyFirstColumn=!1;this.stickyLastColumn=!1;this._selectedValues=[];this._sortKey="";this._sortDirection=""}static get styles(){return[d]}get selected(){return this._selectedValues}set selected(e){this._selectedValues=e,this.updateComplete.then(()=>{this.querySelectorAll("bl-table-header-cell,bl-table-cell,bl-table-row").forEach(l=>{l.requestUpdate()})})}get sortKey(){return this._sortKey}set sortKey(e){this._sortKey=e}get sortDirection(){return this._sortDirection}set sortDirection(e){this._sortDirection=e}updated(e){(e.has("selectable")||e.has("multiple")||e.has("stickyFirstColumn")||e.has("stickyLastColumn")||e.has("sortable"))&&this.querySelectorAll("bl-table-header-cell,bl-table-cell,bl-table-row").forEach(l=>{l.requestUpdate()})}get tableRows(){return this.querySelectorAll("bl-table-body bl-table-row")}isFirstColumnSticky(){return this.stickyFirstColumn}isLastColumnSticky(){return this.stickyLastColumn}isSelectable(e=!1){return e?this.multiple&&this.selectable:this.selectable}isRowSelected(e){return this.selected.includes(e)}isAllSelected(){return Array.from(this.tableRows).every(e=>this.selected.includes(e.selectionKey))}isAnySelected(){return!this.isAllSelected()&&Array.from(this.tableRows).some(e=>!e.disabled&&this.selected.includes(e.selectionKey))}isAllUnselectedDisabled(){return Array.from(this.tableRows).filter(e=>!this.selected.includes(e.selectionKey)).every(e=>e.disabled)}onSelectionChange(e=!1,l,i){e?this.handleHeaderSelection(l):this.handleRowSelection(l,i),this.notifyRowSelectionChange()}handleHeaderSelection(e){this.selected=e?this.getSelectedValuesFromRows():[]}handleRowSelection(e,l){e?this.addSelection(l):this.removeSelection(l)}notifyRowSelectionChange(){this.onRowSelect(this.selected)}addSelection(e){this.selected.includes(e)||this.selected.push(e)}removeSelection(e){this.selected=this.selected.filter(l=>l!==e)}getSelectedValuesFromRows(){return Array.from(this.tableRows).filter(e=>!e.disabled).map(e=>e.selectionKey)}resetScrollPosition(){var l;let e=(l=this.shadowRoot)==null?void 0:l.querySelector(".table-wrapper");e&&e.scrollTo({behavior:"smooth",top:0})}onSortChange(e,l){this._sortKey=e,this._sortDirection=l,this.onSort([this.sortKey,this.sortDirection]),this.updateComplete.then(()=>{this.querySelectorAll("bl-table-header-cell").forEach(i=>{i.requestUpdate()})}),this.resetScrollPosition()}render(){return c` <div class="table-wrapper">
|
|
2
|
+
<div class="table">
|
|
3
|
+
<table>
|
|
4
|
+
<slot></slot>
|
|
5
|
+
</table>
|
|
6
|
+
</div>
|
|
7
|
+
</div>`}};r([s({type:Array,reflect:!0,attribute:"selected"})],t.prototype,"selected",1),r([s({type:Boolean,reflect:!0})],t.prototype,"selectable",2),r([s({type:Boolean,reflect:!0})],t.prototype,"multiple",2),r([s({type:Boolean,reflect:!0})],t.prototype,"sortable",2),r([s({type:Boolean,reflect:!0,attribute:"sticky-first-column"})],t.prototype,"stickyFirstColumn",2),r([s({type:Boolean,reflect:!0,attribute:"sticky-last-column"})],t.prototype,"stickyLastColumn",2),r([s({type:String,reflect:!0,attribute:"sort-key"})],t.prototype,"sortKey",1),r([s({type:String,reflect:!0,attribute:"sort-direction"})],t.prototype,"sortDirection",1),r([a(m)],t.prototype,"onSort",2),r([a(y)],t.prototype,"onRowSelect",2),r([o()],t.prototype,"_selectedValues",2),r([o()],t.prototype,"_sortKey",2),r([o()],t.prototype,"_sortDirection",2),t=r([u(b)],t);export{b as a,m as b,y as c,t as d};
|
|
8
|
+
//# sourceMappingURL=chunk-WJ2RNEDL.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/table/bl-table.css", "../src/components/table/bl-table.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:block;height:100%}.table-wrapper{overflow:auto;border:1px solid var(--bl-color-neutral-lighter);border-radius:var(--bl-size-3xs);position:relative;max-height:100%}.table{width:100%;display:table;border-spacing:0}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport style from \"./bl-table.css\";\nimport BlTableCell from \"./table-cell/bl-table-cell\";\nimport BlTableHeaderCell from \"./table-header-cell/bl-table-header-cell\";\nimport BlTableRow from \"./table-row/bl-table-row\";\n\nexport const blTableTag = \"bl-table\";\n\nexport const blSortChangeEventName = \"bl-sort\";\nexport const blRowSelectChangeEventName = \"bl-row-select\";\n\nexport type SortDirection = \"asc\" | \"desc\" | \"\";\n\n/**\n * @tag bl-table\n * @summary Baklava Table component\n *\n */\n@customElement(blTableTag)\nexport default class BlTable extends LitElement {\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n /**\n * Selected table row selection key list\n */\n @property({ type: Array, reflect: true, attribute: \"selected\" })\n get selected(): string[] {\n return this._selectedValues;\n }\n\n set selected(value: string[]) {\n this._selectedValues = value;\n this.updateComplete.then(() => {\n this.querySelectorAll(\"bl-table-header-cell,bl-table-cell,bl-table-row\").forEach(com => {\n (com as BlTableHeaderCell | BlTableCell | BlTableRow).requestUpdate();\n });\n });\n }\n\n /**\n * Sets table row as selectable\n */\n @property({ type: Boolean, reflect: true })\n selectable = false;\n\n /**\n * Sets table row multiple selection enable\n */\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /**\n * Sets table as sortable\n */\n @property({ type: Boolean, reflect: true })\n sortable = false;\n /**\n * Sets table first column as sticky\n */\n @property({ type: Boolean, reflect: true, attribute: \"sticky-first-column\" })\n stickyFirstColumn = false;\n /**\n * Sets table last column as sticky\n */\n @property({ type: Boolean, reflect: true, attribute: \"sticky-last-column\" })\n stickyLastColumn = false;\n\n /**\n * Sets table sorted column key\n */\n @property({ type: String, reflect: true, attribute: \"sort-key\" })\n get sortKey(): string {\n return this._sortKey;\n }\n\n set sortKey(value: string) {\n this._sortKey = value;\n }\n\n /**\n * Sets table sorting direction\n */\n @property({ type: String, reflect: true, attribute: \"sort-direction\" })\n get sortDirection(): SortDirection {\n return this._sortDirection;\n }\n\n set sortDirection(value: SortDirection) {\n this._sortDirection = value;\n }\n\n /**\n * Fires when table sort options changed\n */\n @event(blSortChangeEventName) private onSort: EventDispatcher<string[]>;\n\n /**\n * Fires when selected table rows changed\n */\n @event(blRowSelectChangeEventName) private onRowSelect: EventDispatcher<string[]>;\n\n @state() private _selectedValues: string[] = [];\n\n @state() private _sortKey: string = \"\";\n\n @state() private _sortDirection: SortDirection = \"\";\n\n protected updated(_changedProperties: PropertyValues) {\n if (\n _changedProperties.has(\"selectable\") ||\n _changedProperties.has(\"multiple\") ||\n _changedProperties.has(\"stickyFirstColumn\") ||\n _changedProperties.has(\"stickyLastColumn\") ||\n _changedProperties.has(\"sortable\")\n ) {\n this.querySelectorAll(\"bl-table-header-cell,bl-table-cell,bl-table-row\").forEach(com => {\n (com as BlTableHeaderCell | BlTableCell | BlTableRow).requestUpdate();\n });\n }\n }\n\n get tableRows() {\n return this.querySelectorAll<BlTableRow>(\"bl-table-body bl-table-row\");\n }\n\n isFirstColumnSticky() {\n return this.stickyFirstColumn;\n }\n\n isLastColumnSticky() {\n return this.stickyLastColumn;\n }\n\n isSelectable(isHeaderCell = false) {\n return isHeaderCell ? this.multiple && this.selectable : this.selectable;\n }\n\n isRowSelected(selectionKey: string) {\n return this.selected.includes(selectionKey);\n }\n\n isAllSelected() {\n return Array.from(this.tableRows).every(tr => this.selected.includes(tr.selectionKey));\n }\n\n isAnySelected() {\n return (\n !this.isAllSelected() &&\n Array.from(this.tableRows).some(tr => !tr.disabled && this.selected.includes(tr.selectionKey))\n );\n }\n\n isAllUnselectedDisabled() {\n return Array.from(this.tableRows)\n .filter(tr => !this.selected.includes(tr.selectionKey))\n .every(tr => tr.disabled);\n }\n\n /**\n * Handles selection changes for both header and row selections.\n * @param isHeader - Indicates if the selection change is for the header.\n * @param isSelected - The selection state.\n * @param selectionKey - The key identifying the selected row. It must be there if it is not the header.\n */\n onSelectionChange(isHeader: boolean = false, isSelected: boolean, selectionKey: string) {\n if (isHeader) {\n this.handleHeaderSelection(isSelected);\n } else {\n this.handleRowSelection(isSelected, selectionKey);\n }\n\n this.notifyRowSelectionChange();\n }\n\n /**\n * Updates selected values based on header selection.\n * @param isSelected - The selection state.\n */\n private handleHeaderSelection(isSelected: boolean) {\n this.selected = isSelected ? this.getSelectedValuesFromRows() : [];\n }\n\n /**\n * Updates selected values based on row selection.\n * @param isSelected - The selection state.\n * @param selectionKey - The key identifying the selected row.\n */\n private handleRowSelection(isSelected: boolean, selectionKey: string) {\n if (isSelected) {\n this.addSelection(selectionKey);\n } else {\n this.removeSelection(selectionKey);\n }\n }\n\n /**\n * Notifies about the row selection change.\n */\n private notifyRowSelectionChange() {\n this.onRowSelect(this.selected);\n }\n\n /**\n * Adds a selection key to the selected values.\n * @param selectionKey - The key to add.\n */\n private addSelection(selectionKey: string) {\n if (!this.selected.includes(selectionKey)) {\n this.selected.push(selectionKey);\n }\n }\n\n /**\n * Removes a selection key from the selected values.\n * @param selectionKey - The key to remove.\n */\n private removeSelection(selectionKey: string) {\n this.selected = this.selected.filter(value => value !== selectionKey);\n }\n\n /**\n * Gets the selection keys from all selectable table rows.\n * @returns An array of selection keys.\n */\n private getSelectedValuesFromRows(): string[] {\n return Array.from(this.tableRows)\n .filter(tableRow => !tableRow.disabled)\n .map(tableRow => tableRow.selectionKey);\n }\n\n resetScrollPosition(): void {\n const tableWrapper = this.shadowRoot?.querySelector(\".table-wrapper\");\n\n if (tableWrapper) {\n tableWrapper.scrollTo({\n behavior: \"smooth\",\n top: 0,\n });\n }\n }\n\n onSortChange(sortKey: string, sortDirection: SortDirection) {\n this._sortKey = sortKey;\n this._sortDirection = sortDirection;\n this.onSort([this.sortKey, this.sortDirection]);\n this.updateComplete.then(() => {\n this.querySelectorAll(\"bl-table-header-cell\").forEach(com => {\n (com as BlTableHeaderCell).requestUpdate();\n });\n });\n this.resetScrollPosition();\n }\n\n render(): TemplateResult {\n return html` <div class=\"table-wrapper\">\n <div class=\"table\">\n <table>\n <slot></slot>\n </table>\n </div>\n </div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [blTableTag]: BlTable;\n }\n\n interface HTMLElementEventMap {\n [blSortChangeEventName]: CustomEvent<string[]>;\n [blRowSelectChangeEventName]: CustomEvent<string[]>;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styles", "i", "bl_table_default", "blTableTag", "blSortChangeEventName", "blRowSelectChangeEventName", "BlTable", "s", "bl_table_default", "value", "com", "_changedProperties", "isHeaderCell", "selectionKey", "tr", "isHeader", "isSelected", "tableRow", "_a", "tableWrapper", "sortKey", "sortDirection", "x", "__decorateClass", "e", "event", "t"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{b as a}from"./chunk-IZ2LK5GK.js";var s={};a(s,{templates:()=>e});var e={s144508ac0e146c46:"Hi\xE7bir Sonu\xE7 Bulunamad\u0131",s5d929ff1619ac0c9:"Arama",s716a6024e3fe999c:"G\xF6ster",s76ddb3a843ed8e06:"Aramay\u0131 Temizle",sb1ba2131b9a7c7b0:"Git",sbaace8219b5f4612:"T\xFCm\xFCn\xFC Se\xE7"};export{e as a,s as b};
|
|
2
|
+
//# sourceMappingURL=chunk-XDCNO7EY.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/generated/locales/tr.ts"],
|
|
4
|
+
"sourcesContent": ["\n // Do not modify this file by hand!\n // Re-generate this file by running lit-localize\n\n \n \n\n /* eslint-disable no-irregular-whitespace */\n /* eslint-disable @typescript-eslint/no-explicit-any */\n\n export const templates = {\n 's144508ac0e146c46': `Hi\u00E7bir Sonu\u00E7 Bulunamad\u0131`,\n's5d929ff1619ac0c9': `Arama`,\n's716a6024e3fe999c': `G\u00F6ster`,\n's76ddb3a843ed8e06': `Aramay\u0131 Temizle`,\n'sb1ba2131b9a7c7b0': `Git`,\n'sbaace8219b5f4612': `T\u00FCm\u00FCn\u00FC Se\u00E7`,\n };\n "],
|
|
5
|
+
"mappings": "wCAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,eAAAE,IAUW,IAAMA,EAAY,CACvB,kBAAqB,qCAC3B,kBAAqB,QACrB,kBAAqB,YACrB,kBAAqB,uBACrB,kBAAqB,MACrB,kBAAqB,wBACjB",
|
|
6
|
+
"names": ["tr_exports", "__export", "templates"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var s=function(u,e,n,r){if(n==="a"&&!r)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?u!==e||!r:!e.has(u))throw new TypeError("Cannot read private member from an object whose class did not declare it");return n==="m"?r:n==="a"?r.call(u):r?r.value:e.get(u)},o=function(u,e,n,r,h){if(r==="m")throw new TypeError("Private method is not writable");if(r==="a"&&!h)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?u!==e||!h:!e.has(u))throw new TypeError("Cannot write private member to an object whose class did not declare it");return r==="a"?h.call(u,n):h?h.value=n:e.set(u,n),n};function R(u){var e,n,r,h,v,k,m,x,g,M,E,W,y,C,V,f,P,T,A;class L extends u{constructor(...t){var i,a,l;super(...t),e.add(this),this.internals=this.attachInternals(),n.set(this,!1),r.set(this,!1),h.set(this,!1),v.set(this,void 0),k.set(this,void 0),m.set(this,!0),g.set(this,""),M.set(this,()=>{o(this,h,!0,"f"),o(this,n,!0,"f"),s(this,e,"m",f).call(this)}),E.set(this,()=>{o(this,n,!1,"f"),s(this,e,"m",P).call(this,this.shouldFormValueUpdate()?s(this,g,"f"):""),!this.validity.valid&&s(this,h,"f")&&o(this,r,!0,"f");let c=s(this,e,"m",f).call(this);this.validationMessageCallback&&this.validationMessageCallback(c?this.internals.validationMessage:"")}),W.set(this,()=>{var c;s(this,m,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),o(this,m,!1,"f")),o(this,h,!0,"f"),o(this,r,!0,"f"),s(this,e,"m",f).call(this),(c=this===null||this===void 0?void 0:this.validationMessageCallback)===null||c===void 0||c.call(this,this.showError?this.internals.validationMessage:"")}),y.set(this,void 0),C.set(this,!1),V.set(this,Promise.resolve()),(i=this.addEventListener)===null||i===void 0||i.call(this,"focus",s(this,M,"f")),(a=this.addEventListener)===null||a===void 0||a.call(this,"blur",s(this,E,"f")),(l=this.addEventListener)===null||l===void 0||l.call(this,"invalid",s(this,W,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let t=this.validators.map(l=>l.attribute).flat(),i=super.observedAttributes||[];return[...new Set([...i,...t])]}static getValidator(t){return this.validators.find(i=>i.attribute===t)||null}static getValidators(t){return this.validators.filter(i=>{var a;if(i.attribute===t||!((a=i.attribute)===null||a===void 0)&&a.includes(t))return!0})}get form(){return this.internals.form}get showError(){return s(this,e,"m",f).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(t,i,a){var l;(l=super.attributeChangedCallback)===null||l===void 0||l.call(this,t,i,a);let w=this.constructor.getValidators(t);w!=null&&w.length&&this.validationTarget&&this.setValue(s(this,g,"f"))}setValue(t){var i;o(this,r,!1,"f"),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,""),o(this,g,t,"f");let l=this.shouldFormValueUpdate()?t:null;this.internals.setFormValue(l),s(this,e,"m",P).call(this,l),this.valueChangedCallback&&this.valueChangedCallback(l),s(this,e,"m",f).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(t=>t(s(this,V,"f")))}formResetCallback(){var t,i;o(this,h,!1,"f"),o(this,r,!1,"f"),s(this,e,"m",f).call(this),(t=this.resetFormControl)===null||t===void 0||t.call(this),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,s(this,e,"m",f).call(this)?this.validationMessage:"")}}return n=new WeakMap,r=new WeakMap,h=new WeakMap,v=new WeakMap,k=new WeakMap,m=new WeakMap,g=new WeakMap,M=new WeakMap,E=new WeakMap,W=new WeakMap,y=new WeakMap,C=new WeakMap,V=new WeakMap,e=new WeakSet,x=function(){let t=this.getRootNode(),i=`${this.localName}[name="${this.getAttribute("name")}"]`;return t.querySelectorAll(i)},f=function(){if(this.hasAttribute("disabled"))return!1;let t=s(this,r,"f")||s(this,h,"f")&&!this.validity.valid&&!s(this,n,"f");return t&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),t},P=function(t){let i=this.constructor,a={},l=i.validators,c=[],w=l.some(d=>d.isValid instanceof Promise);s(this,C,"f")||(o(this,V,new Promise(d=>{o(this,y,d,"f")}),"f"),o(this,C,!0,"f")),s(this,v,"f")&&(s(this,v,"f").abort(),o(this,k,s(this,v,"f"),"f"));let b=new AbortController;o(this,v,b,"f");let F,G=!1;l.length&&(l.forEach(d=>{let S=d.key||"customError",_=d.isValid(this,t,b.signal);_ instanceof Promise?(c.push(_),_.then(U=>{U!=null&&(a[S]=!U,F=s(this,e,"m",A).call(this,d,t),s(this,e,"m",T).call(this,a,F))})):(a[S]=!_,this.validity[S]!==!_&&(G=!0),!_&&!F&&(F=s(this,e,"m",A).call(this,d,t)))}),Promise.allSettled(c).then(()=>{var d;b!=null&&b.signal.aborted||(o(this,C,!1,"f"),(d=s(this,y,"f"))===null||d===void 0||d.call(this))}),(G||!w)&&s(this,e,"m",T).call(this,a,F))},T=function(t,i){if(this.validationTarget)this.internals.setValidity(t,i,this.validationTarget),o(this,m,!1,"f");else{if(this.internals.setValidity(t,i),this.internals.validity.valid)return;o(this,m,!0,"f")}},A=function(t,i){if(this.validityCallback){let a=this.validityCallback(t.key||"customError");if(a)return a}return t.message instanceof Function?t.message(this,i):t.message},L}export{R as a};
|
|
2
|
+
//# sourceMappingURL=chunk-XDUIVR6I.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../node_modules/@open-wc/form-control/src/FormControlMixin.ts"],
|
|
4
|
+
"sourcesContent": ["import { Constructor, CustomValidityState, FormControlInterface, FormValue, IControlHost, validationMessageCallback, Validator } from './types.js';\n\nexport function FormControlMixin<\n TBase extends Constructor<HTMLElement & IControlHost> & { observedAttributes?: string [] }\n>(SuperClass: TBase) {\n class FormControl extends SuperClass {\n /** Wires up control instances to be form associated */\n static get formAssociated(): boolean {\n return true;\n }\n\n /**\n * A list of Validator objects that will be evaluated when a control's form\n * value is modified or optionally when a given attribute changes.\n *\n * When a Validator's callback returns false, the entire form control will\n * be set to an invalid state.\n */\n declare static formControlValidators: Validator[];\n\n /**\n * If set to true the control described should be evaluated and validated\n * as part of a group. Like a radio, if any member of the group's validity\n * changes the the other members should update as well.\n */\n declare static formControlValidationGroup: boolean;\n\n private static get validators(): Validator[] {\n return this.formControlValidators || [];\n }\n\n /**\n * Allows the FormControl instance to respond to Validator attributes.\n * For instance, if a given Validator has a `required` attribute, that\n * validator will be evaluated whenever the host's required attribute\n * is updated.\n */\n static get observedAttributes(): string[] {\n const validatorAttributes = this.validators.map((validator) => validator.attribute).flat();\n\n const observedAttributes = super.observedAttributes || [];\n\n /** Make sure there are no duplicates inside the attributes list */\n const attributeSet = new Set([...observedAttributes, ...validatorAttributes]);\n return [...attributeSet] as string[];\n }\n\n /**\n * Return the validator associated with a given attribute. If no\n * Validator is associated with the attribute, it will return null.\n */\n static getValidator(attribute: string): Validator | null {\n return this.validators.find((validator) => validator.attribute === attribute) || null;\n }\n\n /**\n * Get all validators that are set to react to a given attribute\n * @param {string} attribute - The attribute that has changed\n * @returns {Validator[]}\n */\n static getValidators(attribute: string): Validator[] | null {\n return this.validators.filter(validator => {\n if (validator.attribute === attribute || validator.attribute?.includes(attribute)) {\n return true;\n }\n });\n }\n\n /** The ElementInternals instance for the control. */\n internals = this.attachInternals();\n\n /**\n * Keep track of if the control has focus\n * @private\n */\n #focused = false;\n\n /**\n * Exists to control when an error should be displayed\n * @private\n */\n #forceError = false;\n\n /**\n * Toggles to true whenever the element has been focused. This property\n * will reset whenever the control's formResetCallback is called.\n * @private\n */\n #touched = false;\n\n /** An internal abort controller for cancelling pending async validation */\n #abortController?: AbortController;\n #previousAbortController?: AbortController;\n\n /**\n * Used for tracking if a validation target has been set to manage focus\n * when the control's validity is reported\n */\n #awaitingValidationTarget = true;\n\n /** All of the controls within a root with a matching local name and form name */\n get #formValidationGroup(): NodeListOf<FormControl> {\n const rootNode = this.getRootNode() as HTMLElement;\n const selector = `${this.localName}[name=\"${this.getAttribute('name')}\"]`;\n return rootNode.querySelectorAll<FormControl>(selector);\n }\n\n /**\n * Acts as a cache for the current value so the value can be re-evaluated\n * whenever an attribute changes or on some other event.\n */\n #value: FormValue = '';\n\n /**\n * Set this[touched] and this[focused]\n * to true when the element is focused\n * @private\n */\n #onFocus = (): void => {\n this.#touched = true;\n this.#focused = true;\n this.#shouldShowError();\n };\n\n /**\n * Reset this[focused] on blur\n * @private\n */\n #onBlur = (): void => {\n this.#focused = false;\n\n this.#runValidators(this.shouldFormValueUpdate() ? this.#value : '');\n\n /**\n * Set forceError to ensure error messages persist until\n * the value is changed.\n */\n if (!this.validity.valid && this.#touched) {\n this.#forceError = true;\n }\n const showError = this.#shouldShowError();\n if (this.validationMessageCallback) {\n this.validationMessageCallback(showError ? this.internals.validationMessage : '');\n }\n };\n\n /**\n * For the show error state on invalid\n * @private\n */\n #onInvalid = (): void => {\n if (this.#awaitingValidationTarget && this.validationTarget) {\n this.internals.setValidity(\n this.validity,\n this.validationMessage,\n this.validationTarget\n );\n this.#awaitingValidationTarget = false;\n }\n this.#touched = true;\n this.#forceError = true;\n this.#shouldShowError();\n this?.validationMessageCallback?.(this.showError ? this.internals.validationMessage : '');\n };\n\n /** Return a reference to the control's form */\n get form(): HTMLFormElement {\n return this.internals.form;\n }\n\n /**\n * Will return true if it is recommended that the control shows an internal\n * error. If using this property, it is wise to listen for 'invalid' events\n * on the element host and call preventDefault on the event. Doing this will\n * prevent browsers from showing a validation popup.\n */\n get showError(): boolean {\n return this.#shouldShowError();\n }\n\n /**\n * Forward the internals checkValidity method\n * will return the valid state of the control.\n */\n checkValidity(): boolean {\n return this.internals.checkValidity();\n }\n\n /** The element's validity state */\n get validity(): ValidityState {\n return this.internals.validity;\n }\n\n /**\n * The validation message shown by a given Validator object. If the control\n * is in a valid state this should be falsy.\n */\n get validationMessage(): string {\n return this.internals.validationMessage;\n }\n\n /* eslint-disable @typescript-eslint/no-explicit-any */\n constructor(...args: any[]) {\n super(...args);\n this.addEventListener?.('focus', this.#onFocus);\n this.addEventListener?.('blur', this.#onBlur);\n this.addEventListener?.('invalid', this.#onInvalid);\n this.setValue(null);\n }\n\n attributeChangedCallback(name: string, oldValue: string, newValue: string): void {\n super.attributeChangedCallback?.(name, oldValue, newValue);\n\n /**\n * Check to see if a Validator is associated with the changed attribute.\n * If one exists, call control's validate function which will perform\n * control validation.\n */\n const proto = this.constructor as typeof FormControl;\n const validators = proto.getValidators(name);\n\n if (validators?.length && this.validationTarget) {\n this.setValue(this.#value);\n }\n }\n\n /** PUBLIC LIFECYCLE METHODS */\n\n /**\n * Sets the control's form value if the call to `shouldFormValueUpdate`\n * returns `true`.\n * @param value {FormValue} - The value to pass to the form\n */\n setValue(value: FormValue): void {\n this.#forceError = false;\n this.validationMessageCallback?.('');\n this.#value = value;\n const valueShouldUpdate = this.shouldFormValueUpdate();\n const valueToUpdate = valueShouldUpdate ? value : null;\n this.internals.setFormValue(valueToUpdate as string);\n this.#runValidators(valueToUpdate);\n if (this.valueChangedCallback) {\n this.valueChangedCallback(valueToUpdate);\n }\n this.#shouldShowError();\n }\n\n /**\n * This method can be overridden to determine if the control's form value\n * should be set on a call to `setValue`. An example of when a user might want\n * to skip this step is when implementing checkbox-like behavior, first checking\n * to see if `this.checked` is set to a truthy value. By default this returns\n * `true`.\n */\n shouldFormValueUpdate(): boolean {\n return true;\n }\n\n /** Save a reference to the validation complete resolver */\n #validationCompleteResolver?: (value: void | PromiseLike<void>) => void;\n\n /** When true validation will be pending */\n #isValidationPending = false;\n\n #validationComplete = Promise.resolve();\n\n /** A promise that will resolve when all pending validations are complete */\n get validationComplete(): Promise<void> {\n return new Promise(resolve => resolve(this.#validationComplete));\n }\n\n /** DECLARED INSTANCE METHODS AND PROPERTIES*/\n\n /**\n * Resets a form control to its initial state\n */\n declare resetFormControl: () => void;\n\n /**\n * This method is used to override the controls' validity message\n * for a given Validator key. This has the highest level of priority when\n * setting a validationMessage, so use this method wisely.\n *\n * The returned value will be used as the validationMessage for the given key.\n * @param validationKey {string} - The key that has returned invalid\n */\n declare validityCallback: (validationKey: string) => string | void;\n\n /**\n * Called when the control's validationMessage should be changed\n * @param message { string } - The new validation message\n */\n declare validationMessageCallback: (message: string) => void;\n\n /**\n * A callback for when the controls' form value changes. The value\n * passed to this function should not be confused with the control's\n * value property, this is the value that will appear on the form.\n *\n * In cases where `checked` did not exist on the control's prototype\n * upon initialization, this value and the value property will be identical;\n * in cases where `checked` is present upon initialization, this will be\n * effectively `this.checked && this.value`.\n */\n declare valueChangedCallback: (value: FormValue) => void;\n\n /**\n * The element that will receive focus when the control's validity\n * state is reported either by a form submission or via API\n *\n * We use declare since this is optional and we don't particularly\n * care how the consuming component implements this (as a field, member\n * or getter/setter)\n */\n declare validationTarget: HTMLElement | null;\n\n /** PRIVATE LIFECYCLE METHODS */\n\n /**\n * Check to see if an error should be shown. This method will also\n * update the internals state object with the --show-error state\n * if necessary.\n * @private\n */\n #shouldShowError(): boolean {\n if (this.hasAttribute('disabled')) {\n return false;\n }\n\n const showError = this.#forceError || (this.#touched && !this.validity.valid && !this.#focused);\n\n /**\n * At the time of writing Firefox doesn't support states\n * TODO: Remove when check for states when fully support is in place\n */\n if (showError && this.internals.states) {\n this.internals.states.add('--show-error');\n } else if (this.internals.states) {\n this.internals.states.delete('--show-error');\n }\n\n return showError;\n }\n\n #runValidators(value: FormValue): void {\n const proto = this.constructor as typeof FormControl;\n const validity: CustomValidityState = {};\n const validators = proto.validators;\n const asyncValidators: Promise<boolean|void>[] = [];\n const hasAsyncValidators = validators.some((validator) => validator.isValid instanceof Promise)\n\n if (!this.#isValidationPending) {\n this.#validationComplete = new Promise(resolve => {\n this.#validationCompleteResolver = resolve\n });\n this.#isValidationPending = true;\n }\n\n /**\n * If an abort controller exists from a previous validation step\n * notify still-running async validators that we are requesting they\n * discontinue any work.\n */\n if (this.#abortController) {\n this.#abortController.abort();\n this.#previousAbortController = this.#abortController;\n }\n\n /**\n * Create a new abort controller and replace the instance reference\n * so we can clean it up for next time\n */\n const abortController = new AbortController();\n this.#abortController = abortController;\n let validationMessage: string | undefined = undefined;\n\n /** Track to see if any validity key has changed */\n let hasChange = false;\n\n if (!validators.length) {\n return;\n }\n\n validators.forEach(validator => {\n const key = validator.key || 'customError';\n const isValid = validator.isValid(this, value, abortController.signal);\n const isAsyncValidator = isValid instanceof Promise;\n\n if (isAsyncValidator) {\n asyncValidators.push(isValid);\n\n isValid.then(isValidatorValid => {\n if (isValidatorValid === undefined || isValidatorValid === null) {\n return;\n }\n /** Invert the validity state to correspond to the ValidityState API */\n validity[key] = !isValidatorValid;\n\n validationMessage = this.#getValidatorMessageForValue(validator, value);\n this.#setValidityWithOptionalTarget(validity, validationMessage);\n });\n } else {\n /** Invert the validity state to correspond to the ValidityState API */\n validity[key] = !isValid;\n\n if (this.validity[key] !== !isValid) {\n hasChange = true;\n }\n\n // only update the validationMessage for the first invalid scenario\n // so that earlier invalid validators dont get their messages overwritten by later ones\n // in the validators array\n if (!isValid && !validationMessage) {\n validationMessage = this.#getValidatorMessageForValue(validator, value);\n }\n }\n });\n\n /** Once all the async validators have settled, resolve validationComplete */\n Promise.allSettled(asyncValidators)\n .then(() => {\n /** Don't resolve validations if the signal is aborted */\n if (!abortController?.signal.aborted) {\n this.#isValidationPending = false;\n this.#validationCompleteResolver?.();\n }\n });\n\n /**\n * If async validators are present:\n * Only run updates when a sync validator has a change. This is to prevent\n * situations where running sync validators can override async validators\n * that are still in progress\n *\n * If async validators are not present, always update validity\n */\n if (hasChange || !hasAsyncValidators) {\n this.#setValidityWithOptionalTarget(validity, validationMessage);\n }\n }\n\n /**\n * If the validationTarget is not set, the user can decide how they would\n * prefer to handle focus when the field is validated.\n */\n #setValidityWithOptionalTarget(validity: Partial<ValidityState>, validationMessage: string|undefined): void {\n if (this.validationTarget) {\n this.internals.setValidity(validity, validationMessage, this.validationTarget);\n this.#awaitingValidationTarget = false;\n } else {\n this.internals.setValidity(validity, validationMessage);\n\n if (this.internals.validity.valid) {\n return;\n }\n\n /**\n * Sets mark the component as awaiting a validation target\n * if the element dispatches an invalid event, the #onInvalid listener\n * will check to see if the validation target has been set since this call\n * has run. This useful in cases like Lit's use of the query\n * decorator for setting the validationTarget or any scenario\n * where the validationTarget isn't available upon construction\n */\n this.#awaitingValidationTarget = true;\n }\n }\n\n /** Process the validator message attribute */\n #getValidatorMessageForValue(validator: Validator, value: FormValue): string {\n /** If the validity callback exists and returns, use that as the result */\n if (this.validityCallback) {\n const message = this.validityCallback(validator.key || 'customError');\n\n if (message) {\n return message;\n }\n }\n\n if (validator.message instanceof Function) {\n return (validator.message as validationMessageCallback)(this, value);\n } else {\n return validator.message as string;\n }\n }\n\n /** Reset control state when the form is reset */\n formResetCallback() {\n this.#touched = false;\n this.#forceError = false;\n this.#shouldShowError();\n this.resetFormControl?.();\n\n this.validationMessageCallback?.(\n this.#shouldShowError() ? this.validationMessage : ''\n );\n }\n }\n\n return FormControl as Constructor<FormControlInterface> & TBase;\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["FormControlMixin", "SuperClass", "FormControl", "args", "_FormControl_focused", "_FormControl_forceError", "_FormControl_touched", "_FormControl_abortController", "_FormControl_previousAbortController", "_FormControl_awaitingValidationTarget", "_FormControl_value", "_FormControl_onFocus", "__classPrivateFieldSet", "__classPrivateFieldGet", "_FormControl_instances", "_FormControl_shouldShowError", "_FormControl_onBlur", "_FormControl_runValidators", "showError", "_FormControl_onInvalid", "_a", "_FormControl_validationCompleteResolver", "_FormControl_isValidationPending", "_FormControl_validationComplete", "_b", "_c", "validatorAttributes", "validator", "observedAttributes", "attribute", "name", "oldValue", "newValue", "validators", "value", "valueToUpdate", "resolve", "rootNode", "selector", "proto", "validity", "asyncValidators", "hasAsyncValidators", "abortController", "validationMessage", "hasChange", "key", "isValid", "isValidatorValid", "_FormControl_getValidatorMessageForValue", "_FormControl_setValidityWithOptionalTarget", "message"]
|
|
7
|
+
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as s,b as i,c as d}from"./chunk-X2KXJYXQ.js";import{a as l,b as o,f as a}from"./chunk-4OT5AMS5.js";import{
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as s,b as i,c as d}from"./chunk-X2KXJYXQ.js";import{a as l,b as o,f as a}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var u=l`div{padding:var(--bl-size-xl);background-color:var(--bl-color-neutral-full);border-radius:0 0 var(--bl-border-radius-m) var(--bl-border-radius-m)}div[hidden]{display:none}`,p=u;var t=class extends a{constructor(){super(...arguments);this.hidden=!0}static get styles(){return[p]}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{var e;this.tabGroup=this.closest("bl-tab-group"),(e=this.tabGroup)==null||e.registerTabPanel(this)})}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.tabGroup)==null||e.unregisterTabPanel(this)}render(){return o`<div ?hidden=${this.hidden}><slot></slot></div>`}};r([d()],t.prototype,"hidden",2),r([i({type:String,reflect:!0})],t.prototype,"tab",2),t=r([s("bl-tab-panel")],t);export{t as a};
|
|
2
|
+
//# sourceMappingURL=chunk-XLRX2X2I.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as c}from"./chunk-GRL4DWKG.js";import{a as n,b as i,e as s}from"./chunk-X2KXJYXQ.js";import{a as l,b as r,f as a}from"./chunk-4OT5AMS5.js";import{
|
|
1
|
+
import{a as c}from"./chunk-GRL4DWKG.js";import{a as n,b as i,e as s}from"./chunk-X2KXJYXQ.js";import{a as l,b as r,f as a}from"./chunk-4OT5AMS5.js";import{d as e}from"./chunk-IZ2LK5GK.js";var v=l`:host{position:relative;display:flex;align-items:center;background-color:var(--bl-color-neutral-full)}.container{--title-padding-vertical:var(--bl-size-m);--title-padding-horizontal:var(--bl-size-xl);--title-color:var(--bl-color-neutral-darker);--caption-color:var(--bl-color-neutral-darker);--icon-color:var(--bl-color-neutral-darker);--border-bottom-width:var(--bl-size-4xs);--border-left-space:var(--bl-size-xl);--font-title:var(--bl-font-title-3-medium);--font-caption:var(--bl-font-title-4-regular);--tab-right-padding:var(--bl-size-xl);--help-container-width:var(--bl-size-2xl);--tab-height:calc(var(--bl-size-3xl) + var(--bl-size-s));display:flex;border:none;cursor:pointer;background-color:initial;width:max-content;height:var(--tab-height);padding:0 var(--tab-right-padding);margin-right:1px}.container::after{position:absolute;content:"";right:0;top:var(--bl-size-m);height:calc(100% - var(--bl-size-2xl));border-right:1px solid var(--bl-color-neutral-lighter)}:host(:last-of-type) .container::after{border-right:none}:host(:focus-visible){outline:none}:host(:focus-visible) .container,.container:focus-visible{outline:2px solid var(--bl-color-primary);outline-offset:calc(-1 * var(--bl-size-3xs));border-radius:var(--bl-border-radius-s)}:host .container::before{content:"";position:absolute;opacity:0;bottom:calc(-1 * var(--bl-size-4xs));left:var(--border-left-space);width:calc(100% - var(--bl-size-4xl));border-bottom:var(--border-bottom-width) solid var(--bl-color-primary)}:host([selected]:not([disabled])) .container::before{opacity:1}:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .container,:host([selected]) .container,:host(:hover) .container,:host([selected]) .container{--title-color:var(--bl-color-primary);--icon-color:var(--bl-color-primary)}:host([disabled]) .container{cursor:not-allowed;--title-color:var(--bl-color-neutral-lighter);--caption-color:var(--bl-color-neutral-lighter);--icon-color:var(--bl-color-neutral-lighter)}:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) :where(.title, .icon),:host(:hover) :where(.title, .icon){transition:color 120ms ease-out}:host([selected]) .border-bottom{display:inline-block}:host([disabled]) .container.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__,:host([disabled]) .container:hover{cursor:not-allowed}:host([help-text]) button{padding-right:0}.tab-button{width:max-content}.help-container{display:flex;justify-content:center;align-items:center;width:var(--help-container-width);height:100%;font-size:var(--bl-font-size-m);pointer-events:visible;padding-right:var(--tab-right-padding)}bl-tooltip{--bl-tooltip-position:fixed;display:flex}.title{display:flex;align-items:center;justify-content:center;font:var(--font-title);color:var(--title-color);line-height:var(--bl-size-m);white-space:nowrap}.title-container{display:flex;align-items:center;justify-content:center;flex-direction:column;margin:auto}.badge-container{padding-left:var(--bl-size-3xs);display:flex;margin-bottom:1px}.caption{font:var(--font-caption);line-height:var(--bl-size-xs);color:var(--caption-color);text-align:center;margin-top:var(--bl-size-4xs)}.icon{display:flex;color:var(--icon-color);font-size:var(--bl-font-size-l);margin-right:var(--bl-size-3xs);margin-bottom:1px}:host([notify]) .title::after{content:"";height:var(--bl-size-2xs);width:var(--bl-size-2xs);border-radius:var(--bl-size-3xs);margin-left:var(--bl-size-3xs);background-color:var(--bl-color-danger);margin-bottom:1px}`,d=v;var t=class extends a{constructor(){super(...arguments);this.notify=!1;this.badge="";this.selected=!1;this.disabled=!1}static get styles(){return[d]}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{var o;this.tabGroup=this.closest("bl-tab-group"),(o=this.tabGroup)==null||o.registerTab(this)})}disconnectedCallback(){var o;super.disconnectedCallback(),(o=this.tabGroup)==null||o.unregisterTab(this)}select(){this.selected=!0}focus(){this.tab.focus()}updated(o){this.tabIndex=this.selected?0:-1,o.has("selected")&&this.selected&&this._onSelect(this.name)}render(){let o=r` <slot></slot>`,b=this.helpText?r` <div class="help-container">
|
|
2
2
|
<bl-tooltip>
|
|
3
3
|
<bl-button
|
|
4
4
|
slot="tooltip-trigger"
|
|
@@ -28,4 +28,4 @@ import{a as c}from"./chunk-GRL4DWKG.js";import{a as n,b as i,e as s}from"./chunk
|
|
|
28
28
|
${b}
|
|
29
29
|
</button>
|
|
30
30
|
`}};e([i({type:String})],t.prototype,"caption",2),e([i({type:String,reflect:!0})],t.prototype,"name",2),e([i({type:String,attribute:"help-text",reflect:!0})],t.prototype,"helpText",2),e([i({type:String})],t.prototype,"icon",2),e([i({type:Boolean,reflect:!0})],t.prototype,"notify",2),e([i({type:String})],t.prototype,"badge",2),e([i({type:Boolean,reflect:!0})],t.prototype,"selected",2),e([i({type:Boolean,reflect:!0})],t.prototype,"disabled",2),e([c("bl-tab-selected")],t.prototype,"_onSelect",2),e([s(".container")],t.prototype,"tab",2),t=e([n("bl-tab")],t);export{t as a};
|
|
31
|
-
//# sourceMappingURL=chunk-
|
|
31
|
+
//# sourceMappingURL=chunk-YCHZB54C.js.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{a as w,b as g,c as f,d as E,e as y,f as
|
|
1
|
+
import{a as w,b as g,c as f,d as E,e as y,f as _,g as x,h as k}from"./chunk-EZSEQHRH.js";import{a as u}from"./chunk-6LT7O7T2.js";import{a as n}from"./chunk-GRL4DWKG.js";import{a as b,b as i,c as a,e as s}from"./chunk-X2KXJYXQ.js";import{a as h,b as c,f as m}from"./chunk-4OT5AMS5.js";import{d as r}from"./chunk-IZ2LK5GK.js";var M=h`:host{display:contents}.popover{--arrow-display:var(--bl-popover-arrow-display, none);--background-color:var(--bl-popover-background-color, var(--bl-color-neutral-full));--border-color:var(--bl-popover-border-color, var(--bl-color-primary-highlight));--border-size:var(--bl-popover-border-size, 1px);--padding:var(--bl-popover-padding, var(--bl-size-m));--border-radius:var(--bl-popover-border-radius, var(--bl-size-3xs));--position:var(--bl-popover-position, fixed);--max-width:var(--bl-popover-max-width, 100vw);--max-viewport:calc(100vw - var(--bl-size-s));position:var(--position);box-sizing:border-box;border:var(--border-size) solid var(--border-color);padding:var(--padding);border-radius:var(--border-radius);z-index:var(--bl-index-popover);max-width:min(var(--max-viewport), var(--max-width));width:max-content;hyphens:auto;background-color:var(--background-color);font:var(--bl-font-title-3-regular);color:var(--bl-color-neutral-darker)}.popover:not(.visible){visibility:hidden}.arrow{--arrow-rotation:45deg;--size:var(--bl-size-2xs);--arrow-position:calc((var(--size) / -2) - var(--border-size));box-sizing:border-box;display:var(--arrow-display);position:absolute;background-color:var(--background-color);width:var(--size);height:var(--size);transform:rotate(var(--arrow-rotation));border:var(--border-size) solid var(--border-color);border-bottom:none;border-right:none}.popover[data-placement*="bottom"] .arrow{top:var(--arrow-position)}.popover[data-placement*="top"] .arrow{--arrow-rotation:225deg;bottom:var(--arrow-position)}.popover[data-placement*="left"] .arrow{--arrow-rotation:135deg;right:var(--arrow-position)}.popover[data-placement*="right"] .arrow{--arrow-rotation:315deg;left:var(--arrow-position)}`,z=M;var t=class extends m{constructor(){super(...arguments);this.placement="bottom";this.fitSize=!1;this.offset=8;this._visible=!1;this._handleClickOutside=e=>{let o=e.composedPath();!o.includes(this._target)&&!o.includes(this)&&this.hide()}}static get styles(){return[z]}connectedCallback(){super.connectedCallback(),this._handlePopoverShowEvent=this._handlePopoverShowEvent.bind(this),this._handleKeydownEvent=this._handleKeydownEvent.bind(this),this._handleClickOutside=this._handleClickOutside.bind(this)}disconnectedCallback(){super.disconnectedCallback(),this.popoverAutoUpdateCleanup&&this.popoverAutoUpdateCleanup()}getMiddleware(){let e=[];return e.push(E(this.offset),f(),g(),y({padding:4})),this.fitSize&&e.push(_({apply(o){o.elements.floating&&o.elements.reference&&Object.assign(o.elements.floating.style,{"min-width":`${o.elements.reference.getBoundingClientRect().width}px`})}})),e.push(w({element:this.arrow,padding:5})),e}setPopover(){this.target&&(this.popoverAutoUpdateCleanup=x(this.target,this._popover,()=>{k(this.target,this._popover,{placement:this.placement,strategy:"fixed",middleware:this.getMiddleware()}).then(({x:e,y:o,placement:l,middlewareData:p})=>{if(Object.assign(this._popover.style,{left:`${e}px`,top:`${o}px`}),this._popover.dataset.placement=l,p.arrow){let{x:d,y:v}=p.arrow;Object.assign(this.arrow.style,{left:d!=null?`${d}px`:"",top:v!=null?`${v}px`:""})}})}))}get target(){return this._target}set target(e){typeof e=="string"?this._target=document.getElementById(e):e instanceof Element?this._target=e:console.warn("BlPopover target only accepts an Element instance or a string id of a DOM element.")}show(){this._visible=!0,this.setPopover(),this.onBlPopoverShow(""),document.addEventListener("click",this._handleClickOutside),document.addEventListener("keydown",this._handleKeydownEvent),document.addEventListener("bl-popover-show",this._handlePopoverShowEvent)}hide(){this._visible=!1,document.removeEventListener("click",this._handleClickOutside),document.removeEventListener("keydown",this._handleKeydownEvent),document.removeEventListener("bl-popover-show",this._handlePopoverShowEvent),this.onBlPopoverHide("")}get visible(){return this._visible}_handlePopoverShowEvent(e){if(e.target!==this){let{parentElement:o}=e.target;this.contains(o)||this.hide()}}_handleKeydownEvent(e){e.key==="Escape"&&this.visible&&(e.preventDefault(),this.hide())}render(){let e=u({popover:!0,visible:this._visible});return c`<div class=${e}>
|
|
2
2
|
<slot id="popover" aria-live=${this._visible?"polite":"off"}></slot>
|
|
3
3
|
<div class="arrow" aria-hidden="true"></div>
|
|
4
|
-
</div>`}};r([s(".popover")],t.prototype,"
|
|
5
|
-
//# sourceMappingURL=chunk-
|
|
4
|
+
</div>`}};r([s(".popover")],t.prototype,"_popover",2),r([s(".arrow")],t.prototype,"arrow",2),r([i({type:String})],t.prototype,"placement",2),r([a()],t.prototype,"_target",2),r([i({type:Boolean,attribute:"fit-size"})],t.prototype,"fitSize",2),r([i({type:Number})],t.prototype,"offset",2),r([a()],t.prototype,"_visible",2),r([n("bl-popover-show")],t.prototype,"onBlPopoverShow",2),r([n("bl-popover-hide")],t.prototype,"onBlPopoverHide",2),r([i()],t.prototype,"target",1),t=r([b("bl-popover")],t);export{t as a};
|
|
5
|
+
//# sourceMappingURL=chunk-YML6L24Q.js.map
|