scb-wc 0.1.52 → 0.1.54
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.
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import{_ as g,b as _,g as v,h as
|
|
1
|
+
import{_ as g,b as _,g as v,h as b,y as C}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as f}from"../../vendor/decorate.js";import"../scb-icon-button/scb-icon-button.js";(function(){try{var y=typeof globalThis<"u"?globalThis:window;if(!y.__scb_ce_guard_installed__){y.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(r,s,t){try{customElements.get(r)||e(r,s,t)}catch(n){var l=String(n||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw n}}}}catch{}})();var p,m=(p=class extends g{constructor(...e){super(...e),this.dataSorting=!1,this.columnWidthMode="auto",this._sortedColumn=null,this._sortDirection="asc",this._columnWidthFrame=null,this._onSlotChange=()=>{this._attachThListeners()}}render(){return C`
|
|
2
2
|
<div class="scb-table-scroll-wrapper">
|
|
3
3
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
4
4
|
</div>
|
|
5
|
-
`}firstUpdated(){const
|
|
5
|
+
`}firstUpdated(){const e=this.shadowRoot?.querySelector("slot");e&&(e.addEventListener("slotchange",()=>this._attachThListeners()),this._attachThListeners())}updated(e){e.has("dataSorting")&&(this.dataSorting||(this._sortedColumn=null,this._sortDirection="asc"),this._attachThListeners()),e.has("columnWidthMode")&&this._queueColumnWidthUpdate()}disconnectedCallback(){super.disconnectedCallback(),this._columnWidthFrame!==null&&(cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=null)}_getTbody(){const e=this.shadowRoot?.querySelector("slot");if(!e)return null;const r=e.assignedNodes({flatten:!0});for(const s of r)if(s.nodeType===Node.ELEMENT_NODE){const t=s,l=t.tagName.toLowerCase()==="tbody"?t:t.querySelector("tbody");if(l)return l}return null}_getTables(){const e=this.shadowRoot?.querySelector("slot");if(!e)return[];const r=e.assignedNodes({flatten:!0}),s=[];return r.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const l=t;l.tagName.toLowerCase()==="table"&&s.push(l),s.push(...Array.from(l.querySelectorAll("table")))}}),s}_attachThListeners(){const e=this.shadowRoot?.querySelector("slot");if(!e)return;const r=e.assignedNodes({flatten:!0}),s=[],t=[],l=[],n=[];r.forEach(o=>{o.nodeType===Node.ELEMENT_NODE&&(s.push(...o.querySelectorAll("thead")),t.push(...o.querySelectorAll("th")),l.push(...o.querySelectorAll("td")),n.push(...o.querySelectorAll("tr")))}),s.forEach(o=>{o.style.borderTop="1px solid var(--md-sys-color-on-surface)"}),t.forEach((o,i)=>{o.style.textAlign="left",o.style.padding="12px",o.style.position="relative",o.style.backgroundColor="var(--md-sys-color-surface)",o.style.fontFamily="var(--md-sys-typescale-label-medium-font)",o.style.fontSize="var(--md-sys-typescale-label-medium-size)",o.style.lineHeight="var(--md-sys-typescale-label-medium-line-height)",o.style.fontWeight=" var(--weight-bold)",o.style.letterSpacing="var(--md-sys-typescale-label-medium-tracking)",o.style.verticalAlign="bottom",o.style.borderRight="1px solid var(--md-sys-color-on-surface)",o.style.borderBottom="1px solid var(--md-sys-color-on-surface)";const u=(o.textContent??"").replace(/\s+/g," ").trim();for(;o.firstChild;)o.removeChild(o.firstChild);const c=document.createElement("p");if(c.textContent=u,c.style.margin="0",this.dataSorting){const d=document.createElement("scb-icon-button");d.className="scb-sort-icon",d.onclick=()=>this._onThClick(i),d.setAttribute("variant","standard"),d.setAttribute("size","small"),d.style.alignSelf="end",this._sortedColumn===i?(d.setAttribute("variant","filled-tonal"),d.setAttribute("icon",this._sortDirection==="asc"?"arrow_downward":"arrow_upward")):(d.setAttribute("icon","swap_horiz"),d.style.transform+=" rotate(90deg)");const h=document.createElement("div");h.style.display="flex",h.style.gap="8px",h.style.flexWrap="nowrap",h.style.alignItems="center",h.appendChild(c),h.appendChild(d),o.appendChild(h)}else o.appendChild(c)}),l.forEach(o=>{o.style.padding="12px",o.style.textAlign="left",o.style.borderTop="1px solid var(--md-sys-color-outline-variant)",o.style.verticalAlign="text-top",o.style.backgroundColor="var(--md-sys-color-surface)",o.style.fontFamily="var(--md-sys-typescale-body-medium-font)",o.style.fontSize="var(--md-sys-typescale-body-medium-size)",o.style.lineHeight="var(--md-sys-typescale-body-medium-line-height)",o.style.fontWeight="var(--md-sys-typescale-body-medium-weight)",o.style.letterSpacing="var(--md-sys-typescale-body-medium-tracking)",o.style.borderRight="1px solid var(--md-sys-color-on-surface)",o.style.borderBottom="1px solid var(--md-sys-color-on-surface)",o.style.overflowWrap="break-word",o.style.wordBreak="normal",o.style.hyphens="manual"}),n.forEach(o=>{const i=Array.from(o.cells);i.forEach((u,c)=>{u.style.borderRight=c===i.length-1?"none":"1px solid var(--md-sys-color-on-surface)"})});const a=this._getTbody();a&&Array.from(a.querySelectorAll("tr")).forEach((o,i)=>{const u=i%2===0?"var(--md-sys-color-surface-container)":"var(--md-sys-color-surface)";Array.from(o.cells).forEach(c=>{c.style.backgroundColor=u})}),this._queueColumnWidthUpdate()}_queueColumnWidthUpdate(){this._columnWidthFrame!==null&&cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=requestAnimationFrame(()=>{this._columnWidthFrame=null,this._applyColumnWidthMode()})}_applyColumnWidthMode(){this._getTables().forEach(e=>{if(this._removeGeneratedColGroup(e),e.style.tableLayout="",e.style.width="",e.style.minWidth="",e.style.maxWidth="",this.columnWidthMode!=="header")return;const r=Array.from(e.querySelectorAll("thead tr")),s=r[r.length-1];if(!s)return;const t=Array.from(s.cells).map((n,a)=>{const o=this._measureCellContentWidth(n),i=this._measureColumnReadableBodyWidth(e,a);return`${Math.ceil(Math.max(o,i))}px`}),l=t.reduce((n,a)=>n+parseFloat(a),0);this._applyGeneratedColGroup(e,t),e.style.tableLayout="fixed",e.style.width=`${Math.ceil(l)}px`,e.style.minWidth=`${Math.ceil(l)}px`,e.style.maxWidth="none"})}_applyGeneratedColGroup(e,r){const s=document.createElement("colgroup");s.setAttribute("data-scb-generated-column-widths","true"),r.forEach(t=>{const l=document.createElement("col");l.style.width=t,l.style.minWidth=t,s.appendChild(l)}),e.insertBefore(s,e.firstChild)}_removeGeneratedColGroup(e){e.querySelector('colgroup[data-scb-generated-column-widths="true"]')?.remove()}_measureCellContentWidth(e){const r=e.firstElementChild?.cloneNode(!0)??document.createElement("span");e.firstElementChild||(r.textContent=e.textContent??"");const s=window.getComputedStyle(e),t=document.createElement("div");t.style.position="absolute",t.style.left="-99999px",t.style.top="0",t.style.visibility="hidden",t.style.pointerEvents="none",t.style.width="max-content",t.style.maxWidth="none",t.style.whiteSpace="nowrap",t.style.fontFamily=s.fontFamily,t.style.fontSize=s.fontSize,t.style.fontWeight=s.fontWeight,t.style.lineHeight=s.lineHeight,t.style.letterSpacing=s.letterSpacing,r instanceof HTMLElement&&(r.style.width="max-content",r.style.maxWidth="none",r.style.whiteSpace="nowrap"),t.appendChild(r),document.body.appendChild(t);const l=parseFloat(s.paddingLeft||"0"),n=parseFloat(s.paddingRight||"0"),a=t.getBoundingClientRect().width+l+n;return document.body.removeChild(t),a}_measureColumnReadableBodyWidth(e,r){const s=Array.from(e.querySelectorAll("tbody tr")),t=16;return s.reduce((l,n)=>{const a=n.cells[r];if(!a)return l;const o=(a.textContent??"").replace(/\s+/g," ").trim().split(" ").filter(Boolean).reduce((u,c)=>Math.max(u,this._measureCellTextWidth(a,c)),0),i=o>0?o+t:0;return Math.max(l,i)},0)}_measureCellTextWidth(e,r){const s=window.getComputedStyle(e),t=document.createElement("span");t.textContent=r,t.style.position="absolute",t.style.left="-99999px",t.style.top="0",t.style.visibility="hidden",t.style.pointerEvents="none",t.style.whiteSpace="nowrap",t.style.fontFamily=s.fontFamily,t.style.fontSize=s.fontSize,t.style.fontWeight=s.fontWeight,t.style.lineHeight=s.lineHeight,t.style.letterSpacing=s.letterSpacing,document.body.appendChild(t);const l=parseFloat(s.paddingLeft||"0"),n=parseFloat(s.paddingRight||"0"),a=t.getBoundingClientRect().width+l+n;return document.body.removeChild(t),a}_onThClick(e){this.dataSorting&&(this._sortedColumn===e?this._sortDirection=this._sortDirection==="asc"?"desc":"asc":(this._sortedColumn=e,this._sortDirection="asc"),this._sortTable(e,this._sortDirection),this._attachThListeners(),this.dispatchEvent(new CustomEvent("tablesortchange",{detail:{sortedColumn:this._sortedColumn,sortDirection:this._sortDirection},bubbles:!0,composed:!0})))}_sortTable(e,r){const s=this._getTbody();if(!s)return;const t=Array.from(s.querySelectorAll("tr"));t.sort((l,n)=>{const a=this._getCellSortableValue(l.children[e]),o=this._getCellSortableValue(n.children[e]);return this._compareCellValues(a,o,r)}),t.forEach(l=>s.appendChild(l))}_getCellSortableValue(e){if(!e)return"";const r=e,s=this._getSortableAttributeValue(r);if(s)return s;const t=[],l=r.textContent?.replace(/\s+/g," ").trim();return l&&t.push(l),r.querySelectorAll("[data-sort-value], [data-sort], [aria-label], [label], [value], [title]").forEach(n=>{const a=this._getSortableAttributeValue(n);a&&!t.includes(a)&&t.push(a)}),t.join(" ").trim()}_getSortableAttributeValue(e){return(e.getAttribute("data-sort-value")??e.getAttribute("data-sort")??e.getAttribute("aria-label")??e.getAttribute("label")??e.getAttribute("value")??e.getAttribute("title")??"").replace(/\s+/g," ").trim()}_compareCellValues(e,r,s){const t=this._parseSortableNumber(e),l=this._parseSortableNumber(r);if(t!==null&&l!==null)return s==="asc"?t-l:l-t;const n=Date.parse(e.replace(/\s+/g," ")),a=Date.parse(r.replace(/\s+/g," "));if(!isNaN(n)&&!isNaN(a))return s==="asc"?n-a:a-n;const o=e.localeCompare(r,"sv");return s==="asc"?o:-o}_parseSortableNumber(e){const r=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(r))return null;const s=Number(r.replace(/[\s\u00a0\u202f]/g,"").replace(",","."));return Number.isNaN(s)?null:s}},p.styles=_`
|
|
6
6
|
:host {
|
|
7
7
|
display: block;
|
|
8
8
|
color: var(--md-sys-color-on-surface);
|
|
@@ -48,4 +48,4 @@ import{_ as g,b as _,g as v,h as f,y as C}from"../../vendor/vendor.js";import"..
|
|
|
48
48
|
::slotted(th:hover) .scb-sort-icon {
|
|
49
49
|
pointer-events: auto;
|
|
50
50
|
}
|
|
51
|
-
`,p);
|
|
51
|
+
`,p);f([b({type:Boolean,attribute:"data-sorting"})],m.prototype,"dataSorting",void 0);f([b({type:String,attribute:"column-width-mode"})],m.prototype,"columnWidthMode",void 0);m=f([v("scb-table")],m);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.54",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -440,5 +440,5 @@
|
|
|
440
440
|
},
|
|
441
441
|
"./mvc/*": "./mvc/*"
|
|
442
442
|
},
|
|
443
|
-
"buildHash": "
|
|
443
|
+
"buildHash": "7B3642D79F587B438BAC3D6E5D8823B3B4C28B599EB3C0827BE4F6D1B4194FDE"
|
|
444
444
|
}
|
|
@@ -19,6 +19,8 @@ export declare class ScbTable extends LitElement {
|
|
|
19
19
|
private _applyGeneratedColGroup;
|
|
20
20
|
private _removeGeneratedColGroup;
|
|
21
21
|
private _measureCellContentWidth;
|
|
22
|
+
private _measureColumnReadableBodyWidth;
|
|
23
|
+
private _measureCellTextWidth;
|
|
22
24
|
private _onThClick;
|
|
23
25
|
private _sortTable;
|
|
24
26
|
private _getCellSortableValue;
|
package/scb-table/scb-table.js
CHANGED
|
@@ -116,7 +116,7 @@ var o = class extends t {
|
|
|
116
116
|
i.style.display = "flex", i.style.gap = "8px", i.style.flexWrap = "nowrap", i.style.alignItems = "center", i.appendChild(r), i.appendChild(n), e.appendChild(i);
|
|
117
117
|
} else e.appendChild(r);
|
|
118
118
|
}), i.forEach((e) => {
|
|
119
|
-
e.style.padding = "12px", e.style.textAlign = "left", e.style.borderTop = "1px solid var(--md-sys-color-outline-variant)", e.style.verticalAlign = "text-top", e.style.backgroundColor = "var(--md-sys-color-surface)", e.style.fontFamily = "var(--md-sys-typescale-body-medium-font)", e.style.fontSize = "var(--md-sys-typescale-body-medium-size)", e.style.lineHeight = "var(--md-sys-typescale-body-medium-line-height)", e.style.fontWeight = "var(--md-sys-typescale-body-medium-weight)", e.style.letterSpacing = "var(--md-sys-typescale-body-medium-tracking)", e.style.borderRight = "1px solid var(--md-sys-color-on-surface)", e.style.borderBottom = "1px solid var(--md-sys-color-on-surface)";
|
|
119
|
+
e.style.padding = "12px", e.style.textAlign = "left", e.style.borderTop = "1px solid var(--md-sys-color-outline-variant)", e.style.verticalAlign = "text-top", e.style.backgroundColor = "var(--md-sys-color-surface)", e.style.fontFamily = "var(--md-sys-typescale-body-medium-font)", e.style.fontSize = "var(--md-sys-typescale-body-medium-size)", e.style.lineHeight = "var(--md-sys-typescale-body-medium-line-height)", e.style.fontWeight = "var(--md-sys-typescale-body-medium-weight)", e.style.letterSpacing = "var(--md-sys-typescale-body-medium-tracking)", e.style.borderRight = "1px solid var(--md-sys-color-on-surface)", e.style.borderBottom = "1px solid var(--md-sys-color-on-surface)", e.style.overflowWrap = "break-word", e.style.wordBreak = "normal", e.style.hyphens = "manual";
|
|
120
120
|
}), a.forEach((e) => {
|
|
121
121
|
let t = Array.from(e.cells);
|
|
122
122
|
t.forEach((e, n) => {
|
|
@@ -141,7 +141,10 @@ var o = class extends t {
|
|
|
141
141
|
if (this._removeGeneratedColGroup(e), e.style.tableLayout = "", e.style.width = "", e.style.minWidth = "", e.style.maxWidth = "", this.columnWidthMode !== "header") return;
|
|
142
142
|
let t = Array.from(e.querySelectorAll("thead tr")), n = t[t.length - 1];
|
|
143
143
|
if (!n) return;
|
|
144
|
-
let r = Array.from(n.cells).map((
|
|
144
|
+
let r = Array.from(n.cells).map((t, n) => {
|
|
145
|
+
let r = this._measureCellContentWidth(t), i = this._measureColumnReadableBodyWidth(e, n);
|
|
146
|
+
return `${Math.ceil(Math.max(r, i))}px`;
|
|
147
|
+
}), i = r.reduce((e, t) => e + parseFloat(t), 0);
|
|
145
148
|
this._applyGeneratedColGroup(e, r), e.style.tableLayout = "fixed", e.style.width = `${Math.ceil(i)}px`, e.style.minWidth = `${Math.ceil(i)}px`, e.style.maxWidth = "none";
|
|
146
149
|
});
|
|
147
150
|
}
|
|
@@ -163,6 +166,20 @@ var o = class extends t {
|
|
|
163
166
|
let i = parseFloat(n.paddingLeft || "0"), a = parseFloat(n.paddingRight || "0"), o = r.getBoundingClientRect().width + i + a;
|
|
164
167
|
return document.body.removeChild(r), o;
|
|
165
168
|
}
|
|
169
|
+
_measureColumnReadableBodyWidth(e, t) {
|
|
170
|
+
return Array.from(e.querySelectorAll("tbody tr")).reduce((e, n) => {
|
|
171
|
+
let r = n.cells[t];
|
|
172
|
+
if (!r) return e;
|
|
173
|
+
let i = (r.textContent ?? "").replace(/\s+/g, " ").trim().split(" ").filter(Boolean).reduce((e, t) => Math.max(e, this._measureCellTextWidth(r, t)), 0), a = i > 0 ? i + 16 : 0;
|
|
174
|
+
return Math.max(e, a);
|
|
175
|
+
}, 0);
|
|
176
|
+
}
|
|
177
|
+
_measureCellTextWidth(e, t) {
|
|
178
|
+
let n = window.getComputedStyle(e), r = document.createElement("span");
|
|
179
|
+
r.textContent = t, r.style.position = "absolute", r.style.left = "-99999px", r.style.top = "0", r.style.visibility = "hidden", r.style.pointerEvents = "none", r.style.whiteSpace = "nowrap", r.style.fontFamily = n.fontFamily, r.style.fontSize = n.fontSize, r.style.fontWeight = n.fontWeight, r.style.lineHeight = n.lineHeight, r.style.letterSpacing = n.letterSpacing, document.body.appendChild(r);
|
|
180
|
+
let i = parseFloat(n.paddingLeft || "0"), a = parseFloat(n.paddingRight || "0"), o = r.getBoundingClientRect().width + i + a;
|
|
181
|
+
return document.body.removeChild(r), o;
|
|
182
|
+
}
|
|
166
183
|
_onThClick(e) {
|
|
167
184
|
this.dataSorting && (this._sortedColumn === e ? this._sortDirection = this._sortDirection === "asc" ? "desc" : "asc" : (this._sortedColumn = e, this._sortDirection = "asc"), this._sortTable(e, this._sortDirection), this._attachThListeners(), this.dispatchEvent(new CustomEvent("tablesortchange", {
|
|
168
185
|
detail: {
|
package/scb-wc.bundle.js
CHANGED
|
@@ -12144,7 +12144,7 @@ var ScbWc=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`Module
|
|
|
12144
12144
|
<div class="scb-table-scroll-wrapper">
|
|
12145
12145
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
12146
12146
|
</div>
|
|
12147
|
-
`}firstUpdated(){let e=this.shadowRoot?.querySelector(`slot`);e&&(e.addEventListener(`slotchange`,()=>this._attachThListeners()),this._attachThListeners())}updated(e){e.has(`dataSorting`)&&(this.dataSorting||(this._sortedColumn=null,this._sortDirection=`asc`),this._attachThListeners()),e.has(`columnWidthMode`)&&this._queueColumnWidthUpdate()}disconnectedCallback(){super.disconnectedCallback(),this._columnWidthFrame!==null&&(cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=null)}_getTbody(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return null;let t=e.assignedNodes({flatten:!0});for(let e of t)if(e.nodeType===Node.ELEMENT_NODE){let t=e,n=t.tagName.toLowerCase()===`tbody`?t:t.querySelector(`tbody`);if(n)return n}return null}_getTables(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return[];let t=e.assignedNodes({flatten:!0}),n=[];return t.forEach(e=>{if(e.nodeType===Node.ELEMENT_NODE){let t=e;t.tagName.toLowerCase()===`table`&&n.push(t),n.push(...Array.from(t.querySelectorAll(`table`)))}}),n}_attachThListeners(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return;let t=e.assignedNodes({flatten:!0}),n=[],r=[],i=[],a=[];t.forEach(e=>{e.nodeType===Node.ELEMENT_NODE&&(n.push(...e.querySelectorAll(`thead`)),r.push(...e.querySelectorAll(`th`)),i.push(...e.querySelectorAll(`td`)),a.push(...e.querySelectorAll(`tr`)))}),n.forEach(e=>{e.style.borderTop=`1px solid var(--md-sys-color-on-surface)`}),r.forEach((e,t)=>{e.style.textAlign=`left`,e.style.padding=`12px`,e.style.position=`relative`,e.style.backgroundColor=`var(--md-sys-color-surface)`,e.style.fontFamily=`var(--md-sys-typescale-label-medium-font)`,e.style.fontSize=`var(--md-sys-typescale-label-medium-size)`,e.style.lineHeight=`var(--md-sys-typescale-label-medium-line-height)`,e.style.fontWeight=` var(--weight-bold)`,e.style.letterSpacing=`var(--md-sys-typescale-label-medium-tracking)`,e.style.verticalAlign=`bottom`,e.style.borderRight=`1px solid var(--md-sys-color-on-surface)`,e.style.borderBottom=`1px solid var(--md-sys-color-on-surface)`;let n=(e.textContent??``).replace(/\s+/g,` `).trim();for(;e.firstChild;)e.removeChild(e.firstChild);let r=document.createElement(`p`);if(r.textContent=n,r.style.margin=`0`,this.dataSorting){let n=document.createElement(`scb-icon-button`);n.className=`scb-sort-icon`,n.onclick=()=>this._onThClick(t),n.setAttribute(`variant`,`standard`),n.setAttribute(`size`,`small`),n.style.alignSelf=`end`,this._sortedColumn===t?(n.setAttribute(`variant`,`filled-tonal`),n.setAttribute(`icon`,this._sortDirection===`asc`?`arrow_downward`:`arrow_upward`)):(n.setAttribute(`icon`,`swap_horiz`),n.style.transform+=` rotate(90deg)`);let i=document.createElement(`div`);i.style.display=`flex`,i.style.gap=`8px`,i.style.flexWrap=`nowrap`,i.style.alignItems=`center`,i.appendChild(r),i.appendChild(n),e.appendChild(i)}else e.appendChild(r)}),i.forEach(e=>{e.style.padding=`12px`,e.style.textAlign=`left`,e.style.borderTop=`1px solid var(--md-sys-color-outline-variant)`,e.style.verticalAlign=`text-top`,e.style.backgroundColor=`var(--md-sys-color-surface)`,e.style.fontFamily=`var(--md-sys-typescale-body-medium-font)`,e.style.fontSize=`var(--md-sys-typescale-body-medium-size)`,e.style.lineHeight=`var(--md-sys-typescale-body-medium-line-height)`,e.style.fontWeight=`var(--md-sys-typescale-body-medium-weight)`,e.style.letterSpacing=`var(--md-sys-typescale-body-medium-tracking)`,e.style.borderRight=`1px solid var(--md-sys-color-on-surface)`,e.style.borderBottom=`1px solid var(--md-sys-color-on-surface)`}),a.forEach(e=>{let t=Array.from(e.cells);t.forEach((e,n)=>{e.style.borderRight=n===t.length-1?`none`:`1px solid var(--md-sys-color-on-surface)`})});let o=this._getTbody();o&&Array.from(o.querySelectorAll(`tr`)).forEach((e,t)=>{let n=t%2==0?`var(--md-sys-color-surface-container)`:`var(--md-sys-color-surface)`;Array.from(e.cells).forEach(e=>{e.style.backgroundColor=n})}),this._queueColumnWidthUpdate()}_queueColumnWidthUpdate(){this._columnWidthFrame!==null&&cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=requestAnimationFrame(()=>{this._columnWidthFrame=null,this._applyColumnWidthMode()})}_applyColumnWidthMode(){this._getTables().forEach(e=>{if(this._removeGeneratedColGroup(e),e.style.tableLayout=``,e.style.width=``,e.style.minWidth=``,e.style.maxWidth=``,this.columnWidthMode!==`header`)return;let t=Array.from(e.querySelectorAll(`thead tr`)),n=t[t.length-1];if(!n)return;let r=Array.from(n.cells).map(e
|
|
12147
|
+
`}firstUpdated(){let e=this.shadowRoot?.querySelector(`slot`);e&&(e.addEventListener(`slotchange`,()=>this._attachThListeners()),this._attachThListeners())}updated(e){e.has(`dataSorting`)&&(this.dataSorting||(this._sortedColumn=null,this._sortDirection=`asc`),this._attachThListeners()),e.has(`columnWidthMode`)&&this._queueColumnWidthUpdate()}disconnectedCallback(){super.disconnectedCallback(),this._columnWidthFrame!==null&&(cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=null)}_getTbody(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return null;let t=e.assignedNodes({flatten:!0});for(let e of t)if(e.nodeType===Node.ELEMENT_NODE){let t=e,n=t.tagName.toLowerCase()===`tbody`?t:t.querySelector(`tbody`);if(n)return n}return null}_getTables(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return[];let t=e.assignedNodes({flatten:!0}),n=[];return t.forEach(e=>{if(e.nodeType===Node.ELEMENT_NODE){let t=e;t.tagName.toLowerCase()===`table`&&n.push(t),n.push(...Array.from(t.querySelectorAll(`table`)))}}),n}_attachThListeners(){let e=this.shadowRoot?.querySelector(`slot`);if(!e)return;let t=e.assignedNodes({flatten:!0}),n=[],r=[],i=[],a=[];t.forEach(e=>{e.nodeType===Node.ELEMENT_NODE&&(n.push(...e.querySelectorAll(`thead`)),r.push(...e.querySelectorAll(`th`)),i.push(...e.querySelectorAll(`td`)),a.push(...e.querySelectorAll(`tr`)))}),n.forEach(e=>{e.style.borderTop=`1px solid var(--md-sys-color-on-surface)`}),r.forEach((e,t)=>{e.style.textAlign=`left`,e.style.padding=`12px`,e.style.position=`relative`,e.style.backgroundColor=`var(--md-sys-color-surface)`,e.style.fontFamily=`var(--md-sys-typescale-label-medium-font)`,e.style.fontSize=`var(--md-sys-typescale-label-medium-size)`,e.style.lineHeight=`var(--md-sys-typescale-label-medium-line-height)`,e.style.fontWeight=` var(--weight-bold)`,e.style.letterSpacing=`var(--md-sys-typescale-label-medium-tracking)`,e.style.verticalAlign=`bottom`,e.style.borderRight=`1px solid var(--md-sys-color-on-surface)`,e.style.borderBottom=`1px solid var(--md-sys-color-on-surface)`;let n=(e.textContent??``).replace(/\s+/g,` `).trim();for(;e.firstChild;)e.removeChild(e.firstChild);let r=document.createElement(`p`);if(r.textContent=n,r.style.margin=`0`,this.dataSorting){let n=document.createElement(`scb-icon-button`);n.className=`scb-sort-icon`,n.onclick=()=>this._onThClick(t),n.setAttribute(`variant`,`standard`),n.setAttribute(`size`,`small`),n.style.alignSelf=`end`,this._sortedColumn===t?(n.setAttribute(`variant`,`filled-tonal`),n.setAttribute(`icon`,this._sortDirection===`asc`?`arrow_downward`:`arrow_upward`)):(n.setAttribute(`icon`,`swap_horiz`),n.style.transform+=` rotate(90deg)`);let i=document.createElement(`div`);i.style.display=`flex`,i.style.gap=`8px`,i.style.flexWrap=`nowrap`,i.style.alignItems=`center`,i.appendChild(r),i.appendChild(n),e.appendChild(i)}else e.appendChild(r)}),i.forEach(e=>{e.style.padding=`12px`,e.style.textAlign=`left`,e.style.borderTop=`1px solid var(--md-sys-color-outline-variant)`,e.style.verticalAlign=`text-top`,e.style.backgroundColor=`var(--md-sys-color-surface)`,e.style.fontFamily=`var(--md-sys-typescale-body-medium-font)`,e.style.fontSize=`var(--md-sys-typescale-body-medium-size)`,e.style.lineHeight=`var(--md-sys-typescale-body-medium-line-height)`,e.style.fontWeight=`var(--md-sys-typescale-body-medium-weight)`,e.style.letterSpacing=`var(--md-sys-typescale-body-medium-tracking)`,e.style.borderRight=`1px solid var(--md-sys-color-on-surface)`,e.style.borderBottom=`1px solid var(--md-sys-color-on-surface)`,e.style.overflowWrap=`break-word`,e.style.wordBreak=`normal`,e.style.hyphens=`manual`}),a.forEach(e=>{let t=Array.from(e.cells);t.forEach((e,n)=>{e.style.borderRight=n===t.length-1?`none`:`1px solid var(--md-sys-color-on-surface)`})});let o=this._getTbody();o&&Array.from(o.querySelectorAll(`tr`)).forEach((e,t)=>{let n=t%2==0?`var(--md-sys-color-surface-container)`:`var(--md-sys-color-surface)`;Array.from(e.cells).forEach(e=>{e.style.backgroundColor=n})}),this._queueColumnWidthUpdate()}_queueColumnWidthUpdate(){this._columnWidthFrame!==null&&cancelAnimationFrame(this._columnWidthFrame),this._columnWidthFrame=requestAnimationFrame(()=>{this._columnWidthFrame=null,this._applyColumnWidthMode()})}_applyColumnWidthMode(){this._getTables().forEach(e=>{if(this._removeGeneratedColGroup(e),e.style.tableLayout=``,e.style.width=``,e.style.minWidth=``,e.style.maxWidth=``,this.columnWidthMode!==`header`)return;let t=Array.from(e.querySelectorAll(`thead tr`)),n=t[t.length-1];if(!n)return;let r=Array.from(n.cells).map((t,n)=>{let r=this._measureCellContentWidth(t),i=this._measureColumnReadableBodyWidth(e,n);return`${Math.ceil(Math.max(r,i))}px`}),i=r.reduce((e,t)=>e+parseFloat(t),0);this._applyGeneratedColGroup(e,r),e.style.tableLayout=`fixed`,e.style.width=`${Math.ceil(i)}px`,e.style.minWidth=`${Math.ceil(i)}px`,e.style.maxWidth=`none`})}_applyGeneratedColGroup(e,t){let n=document.createElement(`colgroup`);n.setAttribute(`data-scb-generated-column-widths`,`true`),t.forEach(e=>{let t=document.createElement(`col`);t.style.width=e,t.style.minWidth=e,n.appendChild(t)}),e.insertBefore(n,e.firstChild)}_removeGeneratedColGroup(e){e.querySelector(`colgroup[data-scb-generated-column-widths="true"]`)?.remove()}_measureCellContentWidth(e){let t=e.firstElementChild?.cloneNode(!0)??document.createElement(`span`);e.firstElementChild||(t.textContent=e.textContent??``);let n=window.getComputedStyle(e),r=document.createElement(`div`);r.style.position=`absolute`,r.style.left=`-99999px`,r.style.top=`0`,r.style.visibility=`hidden`,r.style.pointerEvents=`none`,r.style.width=`max-content`,r.style.maxWidth=`none`,r.style.whiteSpace=`nowrap`,r.style.fontFamily=n.fontFamily,r.style.fontSize=n.fontSize,r.style.fontWeight=n.fontWeight,r.style.lineHeight=n.lineHeight,r.style.letterSpacing=n.letterSpacing,t instanceof HTMLElement&&(t.style.width=`max-content`,t.style.maxWidth=`none`,t.style.whiteSpace=`nowrap`),r.appendChild(t),document.body.appendChild(r);let i=parseFloat(n.paddingLeft||`0`),a=parseFloat(n.paddingRight||`0`),o=r.getBoundingClientRect().width+i+a;return document.body.removeChild(r),o}_measureColumnReadableBodyWidth(e,t){return Array.from(e.querySelectorAll(`tbody tr`)).reduce((e,n)=>{let r=n.cells[t];if(!r)return e;let i=(r.textContent??``).replace(/\s+/g,` `).trim().split(` `).filter(Boolean).reduce((e,t)=>Math.max(e,this._measureCellTextWidth(r,t)),0),a=i>0?i+16:0;return Math.max(e,a)},0)}_measureCellTextWidth(e,t){let n=window.getComputedStyle(e),r=document.createElement(`span`);r.textContent=t,r.style.position=`absolute`,r.style.left=`-99999px`,r.style.top=`0`,r.style.visibility=`hidden`,r.style.pointerEvents=`none`,r.style.whiteSpace=`nowrap`,r.style.fontFamily=n.fontFamily,r.style.fontSize=n.fontSize,r.style.fontWeight=n.fontWeight,r.style.lineHeight=n.lineHeight,r.style.letterSpacing=n.letterSpacing,document.body.appendChild(r);let i=parseFloat(n.paddingLeft||`0`),a=parseFloat(n.paddingRight||`0`),o=r.getBoundingClientRect().width+i+a;return document.body.removeChild(r),o}_onThClick(e){this.dataSorting&&(this._sortedColumn===e?this._sortDirection=this._sortDirection===`asc`?`desc`:`asc`:(this._sortedColumn=e,this._sortDirection=`asc`),this._sortTable(e,this._sortDirection),this._attachThListeners(),this.dispatchEvent(new CustomEvent(`tablesortchange`,{detail:{sortedColumn:this._sortedColumn,sortDirection:this._sortDirection},bubbles:!0,composed:!0})))}_sortTable(e,t){let n=this._getTbody();if(!n)return;let r=Array.from(n.querySelectorAll(`tr`));r.sort((n,r)=>{let i=this._getCellSortableValue(n.children[e]),a=this._getCellSortableValue(r.children[e]);return this._compareCellValues(i,a,t)}),r.forEach(e=>n.appendChild(e))}_getCellSortableValue(e){if(!e)return``;let t=e,n=this._getSortableAttributeValue(t);if(n)return n;let r=[],i=t.textContent?.replace(/\s+/g,` `).trim();return i&&r.push(i),t.querySelectorAll(`[data-sort-value], [data-sort], [aria-label], [label], [value], [title]`).forEach(e=>{let t=this._getSortableAttributeValue(e);t&&!r.includes(t)&&r.push(t)}),r.join(` `).trim()}_getSortableAttributeValue(e){return(e.getAttribute(`data-sort-value`)??e.getAttribute(`data-sort`)??e.getAttribute(`aria-label`)??e.getAttribute(`label`)??e.getAttribute(`value`)??e.getAttribute(`title`)??``).replace(/\s+/g,` `).trim()}_compareCellValues(e,t,n){let r=this._parseSortableNumber(e),i=this._parseSortableNumber(t);if(r!==null&&i!==null)return n===`asc`?r-i:i-r;let a=Date.parse(e.replace(/\s+/g,` `)),o=Date.parse(t.replace(/\s+/g,` `));if(!isNaN(a)&&!isNaN(o))return n===`asc`?a-o:o-a;let s=e.localeCompare(t,`sv`);return n===`asc`?s:-s}_parseSortableNumber(e){let t=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(t))return null;let n=Number(t.replace(/[\s\u00a0\u202f]/g,``).replace(`,`,`.`));return Number.isNaN(n)?null:n}};N([h({type:Boolean,attribute:`data-sorting`})],Uu.prototype,`dataSorting`,void 0),N([h({type:String,attribute:`column-width-mode`})],Uu.prototype,`columnWidthMode`,void 0),Uu=N([o(`scb-table`)],Uu),S(),v(),P();var Wu=class extends x{constructor(...e){super(...e),this.searchTerm=``,this.pagination=!1,this.filteringSearch=!1,this.noScroll=!1,this.pageSize=10,this.currentPage=1,this.totalRows=0,this._sortedColumn=null,this._sortDirection=`asc`,this._filteredRows=null,this._tbodyObserver=null,this._observedTbody=null,this._pendingTableRefresh=!1,this._suppressTbodyObserver=!1,this._onSlotChange=()=>{this._attachTbodyObserver(),this._refreshFromTableContent()},this._onPaginationChange=e=>{let t=e.detail;t&&typeof t.page==`number`&&this._changePage(t.page)}}static{this.styles=m`
|
|
12148
12148
|
:host {
|
|
12149
12149
|
display: block;
|
|
12150
12150
|
color: var(--md-sys-color-on-surface);
|