@esri/calcite-components/dist/calcite/HZ2E6V2N.js

Web Components for Esri's Calcite Design System.

/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
v3.2.1 */
import{k as m}from"./XDKVBD6O.js";import"./3FSOG4LN.js";import{d as I}from"./CKRTMNFR.js";import{a as u,b as h}from"./5RDOSP2E.js";import{c as g}from"./HPN2C7M6.js";import"./JOSABGK6.js";import{E as A,F as c,R as E,c as z,d as o,h as x,i as T,q as b}from"./BJZTU5BQ.js";function L(){return navigator.userAgentData}function U(){if(!1)return"";let f=L();return f?.brands?f.brands.map(({brand:e,version:i})=>`${e}/${i}`).join(" "):navigator.userAgent}var n={bordered:"bordered",striped:"striped",selectionArea:"selection-area",paginationArea:"pagination-area",container:"container",tableContainer:"table-container",tableFixed:"table--fixed",assistiveText:"assistive-text",selectionActions:"selection-actions"},S={selectionActions:"selection-actions",tableHeader:"table-header",tableFooter:"table-footer"},D=z`@charset "UTF-8";:host([scale=s]){--calcite-internal-table-cell-padding: .25rem;--calcite-internal-table-cell-font-size: var(--calcite-font-size--2);--calcite-internal-table-cell-font-size-secondary: var(--calcite-font-size--3)}:host([scale=m]){--calcite-internal-table-cell-padding: .5rem;--calcite-internal-table-cell-font-size: var(--calcite-font-size--1);--calcite-internal-table-cell-font-size-secondary: var(--calcite-font-size--2)}:host([scale=l]){--calcite-internal-table-cell-padding: 1rem;--calcite-internal-table-cell-font-size: var(--calcite-font-size-0);--calcite-internal-table-cell-font-size-secondary: var(--calcite-font-size--1)}:host{display:flex}.container{display:flex;block-size:100%;inline-size:100%;flex-direction:column}.table-container{overflow:auto;white-space:nowrap;border:1px solid var(--calcite-color-border-3)}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}table{inline-size:100%;border-collapse:collapse;overflow-x:scroll}@-moz-document url-prefix(){table{border-collapse:separate;border-spacing:0}}.table--fixed{table-layout:fixed}.bordered ::slotted(calcite-table-row){--calcite-table-row-border-color: var(--calcite-color-border-3)}.striped ::slotted(calcite-table-row:nth-child(2n+1)){--calcite-table-row-background: var(--calcite-color-foreground-2)}.selection-actions{display:flex;flex-direction:row;margin-inline-start:auto}.selection-area{display:flex;flex-direction:row;align-items:center;padding-block:var(--calcite-internal-table-cell-padding)}.selection-area calcite-chip:last-of-type{margin-inline-end:.5rem}.selection-area calcite-chip:last-of-type:not(:first-of-type){margin-inline-start:.5rem}.selection-area calcite-button{margin-inline-end:1rem}.pagination-area{display:flex;inline-size:100%;flex-direction:row;justify-content:center;padding-block:var(--calcite-internal-table-cell-padding)}calcite-pagination{flex:1;justify-content:center}:host([hidden]){display:none}[hidden]{display:none}`,w=class extends A{constructor(){super(),this.paginationEl=u(),this.tableBodySlotEl=u(),this.tableFootSlotEl=u(),this.tableHeadSlotEl=u(),this.messages=I({blocking:!0}),this.colCount=0,this.pageStartRow=1,this.selectedCount=0,this._selectedItems=[],this.bordered=!1,this.groupSeparator=!1,this.interactionMode="interactive",this.layout="auto",this.numbered=!1,this.pageSize=0,this.scale="m",this.selectionDisplay="top",this.selectionMode="none",this.striped=!1,this.calciteInternalTableRowFocusChange=b({cancelable:!1}),this.calciteTablePageChange=b({cancelable:!1}),this.calciteTableSelect=b({cancelable:!1}),this.listen("calciteTableRowSelect",this.calciteTableRowSelectListener),this.listen("calciteInternalTableRowSelect",this.calciteInternalTableRowSelectListener),this.listen("calciteInternalTableRowFocusRequest",this.calciteInternalTableRowFocusEvent)}static{this.properties={colCount:[16,{},{state:!0}],pageStartRow:[16,{},{state:!0}],readCellContentsToAT:[16,{},{state:!0}],selectedCount:[16,{},{state:!0}],_selectedItems:[16,{},{state:!0}],bordered:[7,{},{reflect:!0,type:Boolean}],caption:1,groupSeparator:[7,{},{reflect:!0,type:Boolean}],interactionMode:[3,{},{reflect:!0}],layout:[3,{},{reflect:!0}],messageOverrides:[0,{},{attribute:!1}],numbered:[7,{},{reflect:!0,type:Boolean}],numberingSystem:[3,{},{reflect:!0}],pageSize:[11,{},{reflect:!0,type:Number}],scale:[3,{},{reflect:!0}],selectedItems:[32,{},{attribute:!1,readOnly:!0}],selectionDisplay:[3,{},{reflect:!0}],selectionMode:[3,{},{reflect:!0}],striped:[7,{},{reflect:!0,type:Boolean}]}}static{this.styles=D}get selectedItems(){return this._selectedItems}async load(){this.readCellContentsToAT=/safari/i.test(U()),this.listenOn(this.el.shadowRoot,"slotchange",this.handleSlotChange)}willUpdate(e){(e.has("groupSeparator")&&(this.hasUpdated||this.groupSeparator!==!1)||e.has("interactionMode")&&(this.hasUpdated||this.interactionMode!=="interactive")||e.has("numbered")&&(this.hasUpdated||this.numbered!==!1)||e.has("numberingSystem")||e.has("pageSize")&&(this.hasUpdated||this.pageSize!==0)||e.has("scale")&&(this.hasUpdated||this.scale!=="m")||e.has("selectionMode")&&(this.hasUpdated||this.selectionMode!=="none"))&&this.updateRows()}handleSlotChange(){this.updateRows()}calciteTableRowSelectListener(e){e.composedPath().includes(this.el)&&this.setSelectedItems(e.target)}calciteInternalTableRowSelectListener(e){e.composedPath().includes(this.el)&&(this.updateSelectedItems(!1),e.stopPropagation())}calciteInternalTableRowFocusEvent(e){let i=e.detail.cellPosition,s=e.detail.rowPosition,a=e.detail.destination,r=e.detail.lastCell,t=this.bodyRows?.filter(p=>!g(p)),l=this.allRows?.filter(p=>!g(p)),R=this.headRows[this.headRows.length-1]?.positionAll,y=t[0]?.positionAll,$=t[t.length-1]?.positionAll,C=this.footRows[0]?.positionAll,F=l[l.length-1]?.positionAll,P=a==="next"&&s===R,M=a==="previous"&&s===C,O=a==="previous"&&s===y,k=a==="next"&&s===$,d;switch(a){case"first":d=0;break;case"last":d=F;break;case"next":d=P?y:k?C:s+1;break;case"previous":d=M?$:O?R:s-1;break}let v=this.allRows?.find(p=>p.positionAll===d)?.cellCount,B=i>v?v:i;d!==void 0&&this.calciteInternalTableRowFocusChange.emit({cellPosition:B,rowPosition:d,destination:a,lastCell:r})}getSlottedRows(e){return e?.assignedElements({flatten:!0})?.filter(i=>i?.matches("calcite-table-row"))}updateRows(){let e=this.getSlottedRows(this.tableHeadSlotEl.value)||[],i=this.getSlottedRows(this.tableBodySlotEl.value)||[],s=this.getSlottedRows(this.tableFootSlotEl.value)||[],a=[...e,...i,...s];e?.forEach(t=>{let l=e?.indexOf(t);t.rowType="head",t.positionSection=l,t.positionSectionLocalized=this.localizeNumber((l+1).toString())}),i?.forEach(t=>{let l=i?.indexOf(t);t.rowType="body",t.positionSection=l,t.positionSectionLocalized=this.localizeNumber((l+1).toString())}),s?.forEach(t=>{let l=s?.indexOf(t);t.rowType="foot",t.positionSection=l,t.positionSectionLocalized=this.localizeNumber((l+1).toString())}),a?.forEach(t=>{t.interactionMode=this.interactionMode,t.selectionMode=this.selectionMode,t.bodyRowCount=i?.length,t.positionAll=a?.indexOf(t),t.numbered=this.numbered,t.scale=this.scale,t.readCellContentsToAT=this.readCellContentsToAT,t.lastVisibleRow=a?.indexOf(t)===a.length-1});let r=e[0]?.cellCount||e[0]?.querySelectorAll("calcite-table-header")?.length;this.colCount=r,this.headRows=e,this.bodyRows=i,this.footRows=s,this.allRows=a,this.updateSelectedItems(),this.paginateRows()}handlePaginationChange(){let e=this.paginationEl.value?.startItem;this.pageStartRow=e||1,this.calciteTablePageChange.emit(),this.updateRows()}paginateRows(){this.bodyRows?.forEach(e=>{let i=e.positionSection+1,s=i>=this.pageStartRow&&i<this.pageStartRow+this.pageSize;e.itemHidden=this.pageSize>0&&!s&&!this.footRows.includes(e),e.lastVisibleRow=i===this.pageStartRow+this.pageSize-1||i===this.bodyRows.length})}async updateSelectedItems(e){let i=this.bodyRows?.filter(s=>s.selected);this._selectedItems=i,this.selectedCount=i?.length,this.allRows?.forEach(s=>{s.selectedRowCount=this.selectedCount,s.selectedRowCountLocalized=this.localizeNumber(this.selectedCount)}),e&&this.calciteTableSelect.emit()}handleDeselectAllRows(){this.bodyRows?.forEach(e=>{e.selected=!1}),this.updateSelectedItems(!0)}setSelectedItems(e){this.bodyRows?.forEach(i=>{e?.rowType==="head"?i.selected=this.selectedCount!==this.bodyRows?.length:i.selected=this.selectionMode==="multiple"||e===i?i.selected:!1}),this.updateSelectedItems(!0)}localizeNumber(e){return m.numberFormatOptions={locale:this.messages._lang,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator},m.localize(e.toString())}renderSelectionArea(){let e=this._selectedItems?.filter(t=>g(t))?.length,i=this.localizeNumber(e?.toString()),a=`${this.localizeNumber(this.selectedCount?.toString())} ${this.messages.selected}`,r=`${i} ${this.messages.hiddenSelected}`;return o`<div class=${c(n.selectionArea)}><calcite-chip .kind=${this.selectedCount>0?"brand":"neutral"} .label=${a} .scale=${this.scale} .value=${a}>${a}</calcite-chip>${e>0&&o`<calcite-chip icon=hide-empty .label=${r} .scale=${this.scale} title=${r??x} .value=${r}>${i}</calcite-chip>`||""}${this.selectedCount>0&&o`<calcite-button icon-start=x kind=neutral @click=${this.handleDeselectAllRows} round .scale=${this.scale} .title=${`${this.messages.clear} ${a} ${this.messages.row}`}>${this.messages.clear}</calcite-button>`||""}<div class=${c(n.selectionActions)}><slot name=${S.selectionActions}></slot></div></div>`}renderPaginationArea(){return o`<div class=${c(n.paginationArea)}><calcite-pagination .groupSeparator=${this.groupSeparator} .numberingSystem=${this.numberingSystem} @calcitePaginationChange=${this.handlePaginationChange} .pageSize=${this.pageSize} .scale=${this.scale} start-item=1 .totalItems=${this.bodyRows?.length} ${h(this.paginationEl)}></calcite-pagination></div>`}renderTHead(){return o`<thead><slot name=${S.tableHeader} ${h(this.tableHeadSlotEl)}></slot></thead>`}renderTBody(){return o`<tbody><slot ${h(this.tableBodySlotEl)}></slot></tbody>`}renderTFoot(){return o`<tfoot><slot name=${S.tableFooter} ${h(this.tableFootSlotEl)}></slot></tfoot>`}render(){return o`<div class=${c(n.container)}>${this.selectionMode!=="none"&&this.selectionDisplay!=="none"&&this.renderSelectionArea()||""}<div class=${c({[n.bordered]:this.bordered,[n.striped]:this.striped,[n.tableContainer]:!0})}><table .ariaColCount=${this.colCount} .ariaMultiSelectable=${this.selectionMode==="multiple"?"true":null} .ariaRowCount=${this.allRows?.length} class=${c({[n.tableFixed]:this.layout==="fixed"})} .role=${this.interactionMode==="interactive"?"grid":"table"} ${h(e=>{e&&T(o`<caption class=${c(n.assistiveText)}>${this.caption}</caption>${this.renderTHead()}${this.renderTBody()}${this.renderTFoot()}`,e)})}></table></div>${this.pageSize>0&&this.renderPaginationArea()||""}</div>`}};E("calcite-table",w);export{w as Table};