scb-wc 0.1.138 → 0.1.140

package/mvc/components/scb-table/scb-table.js

@@ -1,5 +1,5 @@
-import{h as _,m as C,p as f,v,y as S}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as b}from"../../vendor/decorate.js";import"../scb-icon-button/scb-icon-button.js";(function(){try{var p=typeof globalThis<"u"?globalThis:window;if(!p.__scb_ce_guard_installed__){p.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(s,r,t){try{customElements.get(s)||e(s,r,t)}catch(l){var a=String(l||"");if(a.indexOf("already been used")===-1&&a.indexOf("NotSupportedError")===-1)throw l}}}}catch{}})();var y,w=96,E=32,m=(y=class extends _{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 v`
+import{h as _,m as v,p as f,v as C,y as S}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as b}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(s,r,t){try{customElements.get(s)||e(s,r,t)}catch(l){var a=String(l||"");if(a.indexOf("already been used")===-1&&a.indexOf("NotSupportedError")===-1)throw l}}}}catch{}})();var p,w=96,E=32,m=(p=class extends _{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`
       <div class="scb-table-scroll-wrapper">
         <slot @slotchange=${this._onSlotChange}></slot>
       </div>
-    `}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 s=e.assignedNodes({flatten:!0});for(const r of s)if(r.nodeType===Node.ELEMENT_NODE){const t=r,a=t.tagName.toLowerCase()==="tbody"?t:t.querySelector("tbody");if(a)return a}return null}_getTables(){const e=this.shadowRoot?.querySelector("slot");if(!e)return[];const s=e.assignedNodes({flatten:!0}),r=[];return s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const a=t;a.tagName.toLowerCase()==="table"&&r.push(a),r.push(...Array.from(a.querySelectorAll("table")))}}),r}_attachThListeners(){const e=this.shadowRoot?.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0}),r=[],t=[],a=[],l=[],n=[];s.forEach(o=>{if(o.nodeType===Node.ELEMENT_NODE){const i=Array.from(o.querySelectorAll("thead"));r.push(...i),i.forEach(h=>{t.push(...Array.from(h.querySelectorAll("th")))}),a.push(...o.querySelectorAll("th")),l.push(...o.querySelectorAll("td")),n.push(...o.querySelectorAll("tr"))}}),r.forEach(o=>{o.style.borderTop="1px solid var(--md-sys-color-on-surface)"}),a.forEach(o=>{const i=t.indexOf(o),h=i!==-1;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)",o.style.overflowWrap="normal",o.style.wordBreak="normal",o.style.hyphens="manual",this._removeGeneratedSortMarkup(o),o.hasAttribute("scope")||(h?o.setAttribute("scope","col"):o.closest("tbody")&&o.setAttribute("scope","row"));const u=this._getOrCreateHeaderLabel(o,i),g=this._getNormalizedText(u.textContent)||`kolumn ${Math.max(i,0)+1}`;if((u instanceof HTMLParagraphElement||u.getAttribute("data-scb-generated-label")==="true")&&this._applyGeneratedCellTextReset(u),this.dataSorting&&h){o.setAttribute("aria-sort",this._getHeaderAriaSort(i));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.setAttribute("aria-label",this._getSortButtonLabel(g,i)),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)"),this._wrapHeaderWithSortControl(o,u,d)}else o.removeAttribute("aria-sort")}),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="normal",o.style.wordBreak="normal",o.style.hyphens="manual"}),n.forEach(o=>{const i=Array.from(o.cells);i.forEach((h,u)=>{h.style.borderRight=u===i.length-1?"none":"1px solid var(--md-sys-color-on-surface)"})});const c=this._getTbody();c&&Array.from(c.querySelectorAll("tr")).forEach((o,i)=>{const h=i%2===0?"var(--md-sys-color-surface-container)":"var(--md-sys-color-surface)";Array.from(o.cells).forEach(u=>{u.style.backgroundColor=h})}),this._queueColumnWidthUpdate()}_applyGeneratedCellTextReset(e){e.style.margin="0",e.style.color="inherit",e.style.fontFamily="inherit",e.style.fontSize="inherit",e.style.lineHeight="inherit",e.style.fontWeight="inherit",e.style.letterSpacing="inherit"}_removeGeneratedSortMarkup(e){e.querySelectorAll("scb-icon-button.scb-sort-icon").forEach(t=>t.remove());const s=e.querySelector(':scope > [data-scb-sort-header="true"]');if(!(s instanceof HTMLElement))return;const r=s.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement){s.replaceWith(r);return}s.remove()}_getOrCreateHeaderLabel(e,s){const r=e.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement)return r;const t=e.querySelector(":scope > p");if(t instanceof HTMLParagraphElement)return t.setAttribute("data-scb-sort-label","true"),t;const a=Array.from(e.children).find(n=>n instanceof HTMLElement&&!n.matches("scb-icon-button.scb-sort-icon"));if(a)return a.setAttribute("data-scb-sort-label","true"),a;const l=document.createElement("p");return l.setAttribute("data-scb-sort-label","true"),l.setAttribute("data-scb-generated-label","true"),l.textContent=this._getNormalizedText(e.textContent)||`kolumn ${Math.max(s,0)+1}`,e.textContent="",e.appendChild(l),l}_wrapHeaderWithSortControl(e,s,r){const t=document.createElement("div");t.setAttribute("data-scb-sort-header","true"),t.style.display="flex",t.style.gap="8px",t.style.flexWrap="nowrap",t.style.alignItems="center",t.appendChild(s),t.appendChild(r),e.appendChild(t)}_getNormalizedText(e){return(e??"").replace(/\s+/g," ").trim()}_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 s=Array.from(e.querySelectorAll("thead tr")),r=s[s.length-1];if(!r)return;const t=Array.from(r.cells).map((l,n)=>{const c=this._measureCellContentWidth(l),o=this._measureColumnReadableBodyWidth(e,n),i=Math.max(c,o);return`${Math.ceil(i>0?Math.max(i,w):0)}px`}),a=t.reduce((l,n)=>l+parseFloat(n),0);this._applyGeneratedColGroup(e,t),e.style.tableLayout="fixed",e.style.width=`${Math.ceil(a)}px`,e.style.minWidth=`${Math.ceil(a)}px`,e.style.maxWidth="none"})}_applyGeneratedColGroup(e,s){const r=document.createElement("colgroup");r.setAttribute("data-scb-generated-column-widths","true"),s.forEach(t=>{const a=document.createElement("col");a.style.width=t,a.style.minWidth=t,r.appendChild(a)}),e.insertBefore(r,e.firstChild)}_removeGeneratedColGroup(e){e.querySelector('colgroup[data-scb-generated-column-widths="true"]')?.remove()}_measureCellContentWidth(e){const s=e.firstElementChild?.cloneNode(!0)??document.createElement("span");e.firstElementChild||(s.textContent=e.textContent??"");const r=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=r.fontFamily,t.style.fontSize=r.fontSize,t.style.fontWeight=r.fontWeight,t.style.lineHeight=r.lineHeight,t.style.letterSpacing=r.letterSpacing,s instanceof HTMLElement&&(s.style.width="max-content",s.style.maxWidth="none",s.style.whiteSpace="nowrap"),t.appendChild(s),document.body.appendChild(t);const a=parseFloat(r.paddingLeft||"0"),l=parseFloat(r.paddingRight||"0"),n=parseFloat(r.borderLeftWidth||"0"),c=parseFloat(r.borderRightWidth||"0"),o=t.getBoundingClientRect().width+a+l+n+c;return document.body.removeChild(t),o}_measureColumnReadableBodyWidth(e,s){return Array.from(e.querySelectorAll("tbody tr")).reduce((r,t)=>{const a=t.cells[s];if(!a)return r;const l=(a.textContent??"").replace(/\s+/g," ").trim().split(" ").filter(Boolean).reduce((c,o)=>Math.max(c,this._measureCellTextWidth(a,o)),0),n=l>0?l+E:0;return Math.max(r,n)},0)}_measureCellTextWidth(e,s){const r=window.getComputedStyle(e),t=document.createElement("span");t.textContent=s,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=r.fontFamily,t.style.fontSize=r.fontSize,t.style.fontWeight=r.fontWeight,t.style.lineHeight=r.lineHeight,t.style.letterSpacing=r.letterSpacing,document.body.appendChild(t);const a=parseFloat(r.paddingLeft||"0"),l=parseFloat(r.paddingRight||"0"),n=parseFloat(r.borderLeftWidth||"0"),c=parseFloat(r.borderRightWidth||"0"),o=t.getBoundingClientRect().width+a+l+n+c;return document.body.removeChild(t),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})))}_getHeaderAriaSort(e){return this._sortedColumn!==e?"none":this._sortDirection==="asc"?"ascending":"descending"}_getSortButtonLabel(e,s){return`Sortera ${e||`kolumn ${s+1}`} ${this._sortedColumn===s&&this._sortDirection==="asc"?"fallande":"stigande"}`}_sortTable(e,s){const r=this._getTbody();if(!r)return;const t=Array.from(r.querySelectorAll("tr"));t.sort((a,l)=>{const n=this._getCellSortableValue(a.children[e]),c=this._getCellSortableValue(l.children[e]);return this._compareCellValues(n,c,s)}),t.forEach(a=>r.appendChild(a))}_getCellSortableValue(e){if(!e)return"";const s=e,r=this._getSortableAttributeValue(s);if(r)return r;const t=[],a=s.textContent?.replace(/\s+/g," ").trim();return a&&t.push(a),s.querySelectorAll("[data-sort-value], [data-sort], [aria-label], [label], [value], [title]").forEach(l=>{const n=this._getSortableAttributeValue(l);n&&!t.includes(n)&&t.push(n)}),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,s,r){const t=this._parseSortableNumber(e),a=this._parseSortableNumber(s);if(t!==null&&a!==null)return r==="asc"?t-a:a-t;const l=Date.parse(e.replace(/\s+/g," ")),n=Date.parse(s.replace(/\s+/g," "));if(!isNaN(l)&&!isNaN(n))return r==="asc"?l-n:n-l;const c=e.localeCompare(s,"sv");return r==="asc"?c:-c}_parseSortableNumber(e){const s=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(s))return null;const r=Number(s.replace(/[\s\u00a0\u202f]/g,"").replace(",","."));return Number.isNaN(r)?null:r}},y.styles=S`:host{display:block;color:var(--md-sys-color-on-surface);font-family:var(--brand-font, Inter, Arial, sans-serif)}.scb-table-scroll-wrapper{width:100%;overflow-x:auto;overflow-y:auto;max-width:100%;padding-bottom:24px}.scb-table-scroll-wrapper::-webkit-scrollbar{border-radius:var(--md-sys-shape-corner-large);height:8px;width:10px}.scb-table-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--md-sys-color-on-surface);border-radius:var(--md-sys-shape-corner-large);cursor:pointer}.scb-table-scroll-wrapper::-webkit-scrollbar-track{background:var(--md-sys-color-secondary-container);border-radius:var(--md-sys-shape-corner-large)}::slotted(table){border-collapse:collapse;border-spacing:0;min-width:100%;overflow:hidden}::slotted(th) .scb-sort-icon{pointer-events:none}::slotted(th:hover) .scb-sort-icon{pointer-events:auto}`,y);b([f({type:Boolean,attribute:"data-sorting"})],m.prototype,"dataSorting",void 0);b([f({type:String,attribute:"column-width-mode"})],m.prototype,"columnWidthMode",void 0);m=b([C("scb-table")],m);
+    `}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 s=e.assignedNodes({flatten:!0});for(const r of s)if(r.nodeType===Node.ELEMENT_NODE){const t=r,a=t.tagName.toLowerCase()==="tbody"?t:t.querySelector("tbody");if(a)return a}return null}_getTables(){const e=this.shadowRoot?.querySelector("slot");if(!e)return[];const s=e.assignedNodes({flatten:!0}),r=[];return s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const a=t;a.tagName.toLowerCase()==="table"&&r.push(a),r.push(...Array.from(a.querySelectorAll("table")))}}),r}_attachThListeners(){const e=this.shadowRoot?.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0}),r=[],t=[],a=[],l=[],n=[];s.forEach(o=>{if(o.nodeType===Node.ELEMENT_NODE){const i=Array.from(o.querySelectorAll("thead"));r.push(...i),i.forEach(h=>{t.push(...Array.from(h.querySelectorAll("th")))}),a.push(...o.querySelectorAll("th")),l.push(...o.querySelectorAll("td")),n.push(...o.querySelectorAll("tr"))}}),r.forEach(o=>{o.style.borderTop="1px solid var(--md-sys-color-on-surface)"}),a.forEach(o=>{const i=t.indexOf(o),h=i!==-1;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)",o.style.overflowWrap="normal",o.style.wordBreak="normal",o.style.hyphens="manual",this._removeGeneratedSortMarkup(o),o.hasAttribute("scope")||(h?o.setAttribute("scope","col"):o.closest("tbody")&&o.setAttribute("scope","row"));const u=this._getOrCreateHeaderLabel(o,i),g=this._getNormalizedText(u.textContent)||`kolumn ${Math.max(i,0)+1}`;if((u instanceof HTMLParagraphElement||u.getAttribute("data-scb-generated-label")==="true")&&this._applyGeneratedCellTextReset(u),this.dataSorting&&h){o.setAttribute("aria-sort",this._getHeaderAriaSort(i));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.setAttribute("aria-label",this._getSortButtonLabel(g,i)),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)"),this._wrapHeaderWithSortControl(o,u,d)}else o.removeAttribute("aria-sort")}),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="normal",o.style.wordBreak="normal",o.style.hyphens="manual"}),n.forEach(o=>{const i=Array.from(o.cells);i.forEach((h,u)=>{h.style.borderRight=u===i.length-1?"none":"1px solid var(--md-sys-color-on-surface)"})});const c=this._getTbody();c&&Array.from(c.querySelectorAll("tr")).forEach((o,i)=>{const h=i%2===0?"var(--md-sys-color-surface-container)":"var(--md-sys-color-surface)";Array.from(o.cells).forEach(u=>{u.style.backgroundColor=h})}),this._queueColumnWidthUpdate()}_applyGeneratedCellTextReset(e){e.style.margin="0",e.style.color="inherit",e.style.fontFamily="inherit",e.style.fontSize="inherit",e.style.lineHeight="inherit",e.style.fontWeight="inherit",e.style.letterSpacing="inherit"}_removeGeneratedSortMarkup(e){e.querySelectorAll("scb-icon-button.scb-sort-icon").forEach(t=>t.remove());const s=e.querySelector(':scope > [data-scb-sort-header="true"]');if(!(s instanceof HTMLElement))return;const r=s.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement){s.replaceWith(r);return}s.remove()}_getOrCreateHeaderLabel(e,s){const r=e.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement)return r;const t=e.querySelector(":scope > p");if(t instanceof HTMLParagraphElement)return t.setAttribute("data-scb-sort-label","true"),t;const a=Array.from(e.children).find(n=>n instanceof HTMLElement&&!n.matches("scb-icon-button.scb-sort-icon"));if(a)return a.setAttribute("data-scb-sort-label","true"),a;const l=document.createElement("p");return l.setAttribute("data-scb-sort-label","true"),l.setAttribute("data-scb-generated-label","true"),l.textContent=this._getNormalizedText(e.textContent)||`kolumn ${Math.max(s,0)+1}`,e.textContent="",e.appendChild(l),l}_wrapHeaderWithSortControl(e,s,r){const t=document.createElement("div");t.setAttribute("data-scb-sort-header","true"),t.style.display="flex",t.style.gap="8px",t.style.flexWrap="nowrap",t.style.alignItems="center",t.appendChild(s),t.appendChild(r),e.appendChild(t)}_getNormalizedText(e){return(e??"").replace(/\s+/g," ").trim()}_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 s=Array.from(e.querySelectorAll("thead tr")),r=s[s.length-1];if(!r)return;const t=Array.from(r.cells).map((l,n)=>{const c=this._measureCellContentWidth(l),o=this._measureColumnReadableBodyWidth(e,n),i=Math.max(c,o);return`${Math.ceil(i>0?Math.max(i,w):0)}px`}),a=t.reduce((l,n)=>l+parseFloat(n),0);this._applyGeneratedColGroup(e,t),e.style.tableLayout="fixed",e.style.width=`${Math.ceil(a)}px`,e.style.minWidth=`${Math.ceil(a)}px`,e.style.maxWidth="none"})}_applyGeneratedColGroup(e,s){const r=document.createElement("colgroup");r.setAttribute("data-scb-generated-column-widths","true"),s.forEach(t=>{const a=document.createElement("col");a.style.width=t,a.style.minWidth=t,r.appendChild(a)}),e.insertBefore(r,e.firstChild)}_removeGeneratedColGroup(e){e.querySelector('colgroup[data-scb-generated-column-widths="true"]')?.remove()}_measureCellContentWidth(e){const s=e.firstElementChild?.cloneNode(!0)??document.createElement("span");e.firstElementChild||(s.textContent=e.textContent??"");const r=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=r.fontFamily,t.style.fontSize=r.fontSize,t.style.fontWeight=r.fontWeight,t.style.lineHeight=r.lineHeight,t.style.letterSpacing=r.letterSpacing,s instanceof HTMLElement&&(s.style.width="max-content",s.style.maxWidth="none",s.style.whiteSpace="nowrap"),t.appendChild(s),document.body.appendChild(t);const a=parseFloat(r.paddingLeft||"0"),l=parseFloat(r.paddingRight||"0"),n=parseFloat(r.borderLeftWidth||"0"),c=parseFloat(r.borderRightWidth||"0"),o=t.getBoundingClientRect().width+a+l+n+c;return document.body.removeChild(t),o}_measureColumnReadableBodyWidth(e,s){return Array.from(e.querySelectorAll("tbody tr")).reduce((r,t)=>{const a=t.cells[s];if(!a)return r;const l=(a.textContent??"").replace(/\s+/g," ").trim().split(" ").filter(Boolean).reduce((c,o)=>Math.max(c,this._measureCellTextWidth(a,o)),0),n=l>0?l+E:0;return Math.max(r,n)},0)}_measureCellTextWidth(e,s){const r=window.getComputedStyle(e),t=document.createElement("span");t.textContent=s,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=r.fontFamily,t.style.fontSize=r.fontSize,t.style.fontWeight=r.fontWeight,t.style.lineHeight=r.lineHeight,t.style.letterSpacing=r.letterSpacing,document.body.appendChild(t);const a=parseFloat(r.paddingLeft||"0"),l=parseFloat(r.paddingRight||"0"),n=parseFloat(r.borderLeftWidth||"0"),c=parseFloat(r.borderRightWidth||"0"),o=t.getBoundingClientRect().width+a+l+n+c;return document.body.removeChild(t),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})))}_getHeaderAriaSort(e){return this._sortedColumn!==e?"none":this._sortDirection==="asc"?"ascending":"descending"}_getSortButtonLabel(e,s){return`Sortera ${e||`kolumn ${s+1}`} ${this._sortedColumn===s&&this._sortDirection==="asc"?"fallande":"stigande"}`}_sortTable(e,s){const r=this._getTbody();if(!r)return;const t=Array.from(r.querySelectorAll("tr"));t.sort((a,l)=>{const n=this._getCellSortableValue(a.children[e]),c=this._getCellSortableValue(l.children[e]);return this._compareCellValues(n,c,s)}),t.forEach(a=>r.appendChild(a))}_getCellSortableValue(e){if(!e)return"";const s=e,r=this._getSortableAttributeValue(s);if(r)return r;const t=[],a=s.textContent?.replace(/\s+/g," ").trim();return a&&t.push(a),s.querySelectorAll("[data-sort-value], [data-sort], [aria-label], [label], [value], [title]").forEach(l=>{const n=this._getSortableAttributeValue(l);n&&!t.includes(n)&&t.push(n)}),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,s,r){const t=this._parseSortableNumber(e),a=this._parseSortableNumber(s);if(t!==null&&a!==null)return r==="asc"?t-a:a-t;const l=Date.parse(e.replace(/\s+/g," ")),n=Date.parse(s.replace(/\s+/g," "));if(!isNaN(l)&&!isNaN(n))return r==="asc"?l-n:n-l;const c=e.localeCompare(s,"sv");return r==="asc"?c:-c}_parseSortableNumber(e){const s=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(s))return null;const r=Number(s.replace(/[\s\u00a0\u202f]/g,"").replace(",","."));return Number.isNaN(r)?null:r}},p.styles=S`:host{display:block;color:var(--md-sys-color-on-surface);font-family:var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif))}.scb-table-scroll-wrapper{width:100%;overflow-x:auto;overflow-y:auto;max-width:100%;padding-bottom:24px}.scb-table-scroll-wrapper::-webkit-scrollbar{border-radius:var(--md-sys-shape-corner-large);height:8px;width:10px}.scb-table-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--md-sys-color-on-surface);border-radius:var(--md-sys-shape-corner-large);cursor:pointer}.scb-table-scroll-wrapper::-webkit-scrollbar-track{background:var(--md-sys-color-secondary-container);border-radius:var(--md-sys-shape-corner-large)}::slotted(table){border-collapse:collapse;border-spacing:0;font-family:var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));min-width:100%;overflow:hidden}::slotted(th) .scb-sort-icon{pointer-events:none}::slotted(th:hover) .scb-sort-icon{pointer-events:auto}`,p);b([f({type:Boolean,attribute:"data-sorting"})],m.prototype,"dataSorting",void 0);b([f({type:String,attribute:"column-width-mode"})],m.prototype,"columnWidthMode",void 0);m=b([v("scb-table")],m);

package/mvc/components/scb-table-advanced/scb-table-advanced.js

@@ -22,4 +22,4 @@ import{h as _,m,p,v as f,y as v}from"../../vendor/vendor.js";import"../../vendor
             ></scb-pagination>
           `:""}
         </div>
-      `}_onSearchInput(e){const s=e.target.value;this.searchTerm=s,this._filterTable(),this.dispatchEvent(new CustomEvent("tableadvancedchange",{detail:{searchTerm:this.searchTerm,currentPage:this.currentPage},bubbles:!0,composed:!0}))}_filterTable(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;if(s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const i=t.querySelector("tbody");i&&(r=i)}}),!r)return;const o=r,a=this._getTopLevelRows(o),l=this.searchTerm.trim().toLowerCase();if(!l)this._filteredRows=null,a.forEach(t=>t.style.display=""),this._updateTotalRows(),this._ensureCurrentPageWithinBounds(),this.pagination&&this._paginateTable(),this._sortedColumn!==null&&this._sortTable(this._sortedColumn,this._sortDirection);else{this._filteredRows=a.filter(i=>this._getRowSearchText(i).toLowerCase().includes(l)),a.forEach(i=>i.style.display="none");let t=this._filteredRows;this._sortedColumn!==null&&(t=[...t],t.sort((i,h)=>{const d=this._getCellSortableValue(i.children[this._sortedColumn]),c=this._getCellSortableValue(h.children[this._sortedColumn]);return this._compareCellValues(d,c,this._sortDirection)}),this._filteredRows=t),this.totalRows=this._filteredRows.length,this._ensureCurrentPageWithinBounds(),this.pagination?this._paginateTable():this._filteredRows.forEach(i=>i.style.display="")}}firstUpdated(){const e=this.shadowRoot.querySelector("slot");e&&(e.addEventListener("slotchange",()=>this._attachThListeners()),this._attachThListeners(),this._attachTbodyObserver(),this._refreshFromTableContent())}updated(e){super.updated(e),(e.has("searchTerm")||e.has("currentPage")||e.has("pageSize")||e.has("filteringSearch")||e.has("pagination"))&&this.updateComplete.then(()=>{this.isConnected&&this._refreshFromTableContent()})}_disconnectTbodyObserver(){this._tbodyObserver&&(this._tbodyObserver.disconnect(),this._tbodyObserver=null),this._observedTbody=null}_attachTbodyObserver(){const e=this._getTbody();if(!e){this._disconnectTbodyObserver();return}this._observedTbody!==e&&(this._disconnectTbodyObserver(),this._observedTbody=e,this._tbodyObserver=new MutationObserver(()=>{this._suppressTbodyObserver||this._scheduleTableRefresh()}),this._tbodyObserver.observe(e,{childList:!0,subtree:!0,characterData:!0}))}_scheduleTableRefresh(){this._pendingTableRefresh||(this._pendingTableRefresh=!0,queueMicrotask(()=>{this._pendingTableRefresh=!1,this._refreshFromTableContent()}))}_refreshFromTableContent(){if(this._attachTbodyObserver(),this.filteringSearch){this._filterTable();return}if(this._updateTotalRows(),this._ensureCurrentPageWithinBounds(),this._sortedColumn!==null){this._sortTable(this._sortedColumn,this._sortDirection);return}this.pagination&&this._paginateTable()}_ensureCurrentPageWithinBounds(){const e=Math.max(1,Math.ceil(this.totalRows/this.pageSize)),s=Math.min(Math.max(1,this.currentPage),e);s!==this.currentPage&&(this.currentPage=s)}_getTbody(){const e=this.shadowRoot.querySelector("slot");if(!e)return null;const s=e.assignedNodes({flatten:!0});for(const r of s)if(r.nodeType===Node.ELEMENT_NODE){const o=r.querySelector("tbody");if(o)return o}return null}_getTopLevelRows(e){return Array.from(e.children).filter(s=>s instanceof HTMLTableRowElement)}_attachThListeners(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0}),r=[],o=[],a=[],l=[];s.forEach(t=>{t.nodeType===Node.ELEMENT_NODE&&(Array.from(t.querySelectorAll("thead")).forEach(i=>{r.push(...Array.from(i.querySelectorAll("th")))}),o.push(...t.querySelectorAll("th")),a.push(...t.querySelectorAll("td")),l.push(...t.querySelectorAll("tr")))}),o.forEach(t=>{const i=r.indexOf(t),h=i!==-1;t.style.textAlign="left",t.style.padding="16px 0px 16px 32px",t.style.position="relative",t.style.backgroundColor="var(--md-sys-color-surface)",t.style.fontFamily="var(--md-sys-typescale-label-medium-font)",t.style.fontSize="var(--md-sys-typescale-label-medium-size)",t.style.lineHeight="var(--md-sys-typescale-label-medium-line-height)",t.style.fontWeight="var(--md-sys-typescale-label-medium-weight)",t.style.letterSpacing="var(--md-sys-typescale-label-medium-tracking)",t.style.verticalAlign="bottom",this._removeGeneratedSortMarkup(t),t.hasAttribute("scope")||(h?t.setAttribute("scope","col"):t.closest("tbody")&&t.setAttribute("scope","row"));const d=this._getOrCreateHeaderLabel(t,i);if((d instanceof HTMLParagraphElement||d.getAttribute("data-scb-generated-label")==="true")&&this._applyGeneratedCellTextReset(d),!h){t.removeAttribute("aria-sort");return}t.setAttribute("aria-sort",this._getHeaderAriaSort(i));const c=this._getNormalizedText(d.textContent)||`kolumn ${Math.max(i,0)+1}`,n=document.createElement("scb-icon-button");n.className="scb-sort-icon",n.onclick=()=>this._onThClick(i),n.setAttribute("variant","standard"),n.setAttribute("size","small"),n.setAttribute("aria-label",this._getSortButtonLabel(c,i)),this._sortedColumn===i?(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)",n.style.alignSelf="end"),this._wrapHeaderWithSortControl(t,d,n)}),a.forEach(t=>{t.style.padding="16px 0px 16px 32px",t.style.textAlign="left",t.style.borderTop="1px solid var(--md-sys-color-outline-variant)",t.style.verticalAlign="text-top",t.style.backgroundColor="var(--md-sys-color-surface)",t.style.fontFamily="var(--md-sys-typescale-body-medium-font)",t.style.fontSize="var(--md-sys-typescale-body-medium-size)",t.style.lineHeight="var(--md-sys-typescale-body-medium-line-height)",t.style.fontWeight="var(--md-sys-typescale-body-medium-weight)",t.style.letterSpacing="var(--md-sys-typescale-body-medium-tracking)"}),l.forEach((t,i)=>{i%2===1&&t.querySelectorAll("td").forEach(c=>{c.style.backgroundColor="var(--scb-background-row)"});const h=t.querySelectorAll("th");h.length>0&&h.forEach((c,n)=>{n===0&&(c.style.paddingLeft="24px"),n===h.length-1?c.style.paddingRight="24px":c.style.paddingRight=""});const d=t.querySelectorAll("td");d.length>0&&d.forEach((c,n)=>{n===0&&(c.style.paddingLeft="24px"),n===d.length-1?c.style.paddingRight="24px":c.style.paddingRight=""})}),this.pagination&&this._paginateTable()}_applyGeneratedCellTextReset(e){e.style.margin="0",e.style.color="inherit",e.style.fontFamily="inherit",e.style.fontSize="inherit",e.style.lineHeight="inherit",e.style.fontWeight="inherit",e.style.letterSpacing="inherit"}_removeGeneratedSortMarkup(e){e.querySelectorAll("scb-icon-button.scb-sort-icon").forEach(o=>o.remove());const s=e.querySelector(':scope > [data-scb-sort-header="true"]');if(!(s instanceof HTMLElement))return;const r=s.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement){s.replaceWith(r);return}s.remove()}_getOrCreateHeaderLabel(e,s){const r=e.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement)return r;const o=e.querySelector(":scope > p");if(o instanceof HTMLParagraphElement)return o.setAttribute("data-scb-sort-label","true"),o;const a=Array.from(e.children).find(t=>t instanceof HTMLElement&&!t.matches("scb-icon-button.scb-sort-icon"));if(a)return a.setAttribute("data-scb-sort-label","true"),a;const l=document.createElement("p");return l.setAttribute("data-scb-sort-label","true"),l.setAttribute("data-scb-generated-label","true"),l.textContent=this._getNormalizedText(e.textContent)||`kolumn ${Math.max(s,0)+1}`,e.textContent="",e.appendChild(l),l}_wrapHeaderWithSortControl(e,s,r){const o=document.createElement("div");o.setAttribute("data-scb-sort-header","true"),o.style.display="flex",o.style.gap="8px",o.style.flexWrap="nowrap",o.style.alignItems="center",o.appendChild(s),o.appendChild(r),e.appendChild(o)}_getNormalizedText(e){return(e??"").replace(/\s+/g," ").trim()}_onThClick(e){this._sortedColumn===e?this._sortDirection=this._sortDirection==="asc"?"desc":"asc":(this._sortedColumn=e,this._sortDirection="asc"),this._sortTable(e,this._sortDirection),this._attachThListeners()}_getHeaderAriaSort(e){return this._sortedColumn!==e?"none":this._sortDirection==="asc"?"ascending":"descending"}_getSortButtonLabel(e,s){return`Sortera ${e||`kolumn ${s+1}`} ${this._sortedColumn===s&&this._sortDirection==="asc"?"fallande":"stigande"}`}_sortTable(e,s){const r=this.shadowRoot.querySelector("slot");if(!r)return;const o=r.assignedNodes({flatten:!0});let a=null;if(o.forEach(i=>{if(i.nodeType===Node.ELEMENT_NODE){const h=i.querySelector("tbody");h&&(a=h)}}),!a)return;let l;this._filteredRows?l=[...this._filteredRows]:l=this._getTopLevelRows(a),l.sort((i,h)=>{const d=this._getCellSortableValue(i.children[e]),c=this._getCellSortableValue(h.children[e]);return this._compareCellValues(d,c,s)});const t=this._tbodyObserver!==null;t&&this._disconnectTbodyObserver();try{l.forEach(i=>a.appendChild(i))}finally{t&&this._attachTbodyObserver()}this._filteredRows&&(this._filteredRows=l,this.totalRows=this._filteredRows.length),this.pagination&&this._paginateTable()}_getRowSearchText(e){return Array.from(e.cells).map(s=>this._getCellSortableValue(s)).join(" ")}_getCellSortableValue(e){if(!e)return"";const s=e,r=this._getSortableAttributeValue(s);if(r)return r;const o=[],a=s.textContent?.replace(/\s+/g," ").trim();return a&&o.push(a),s.querySelectorAll("[data-sort-value], [data-sort], [aria-label], [label], [value], [title]").forEach(l=>{const t=this._getSortableAttributeValue(l);t&&!o.includes(t)&&o.push(t)}),o.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,s,r){const o=this._parseSortableNumber(e),a=this._parseSortableNumber(s);if(o!==null&&a!==null)return r==="asc"?o-a:a-o;const l=Date.parse(e.replace(/\s+/g," ")),t=Date.parse(s.replace(/\s+/g," "));if(!isNaN(l)&&!isNaN(t))return r==="asc"?l-t:t-l;const i=e.localeCompare(s,"sv");return r==="asc"?i:-i}_parseSortableNumber(e){const s=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(s))return null;const r=Number(s.replace(/[\s\u00a0\u202f]/g,"").replace(",","."));return Number.isNaN(r)?null:r}_updateTotalRows(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;s.forEach(o=>{if(o.nodeType===Node.ELEMENT_NODE){const a=o.querySelector("tbody");a&&(r=a)}}),r&&(this.totalRows=this._getTopLevelRows(r).length,this._ensureCurrentPageWithinBounds())}_paginateTable(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;if(s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const i=t.querySelector("tbody");i&&(r=i)}}),!r)return;let o;this._filteredRows?o=this._filteredRows:o=this._getTopLevelRows(r),this._getTopLevelRows(r).forEach(t=>t.style.display="none");const a=(this.currentPage-1)*this.pageSize,l=a+this.pageSize;o.slice(a,l).forEach(t=>t.style.display="")}_changePage(e){const s=Math.ceil(this.totalRows/this.pageSize);e<1||e>s||(this.currentPage=e,this._paginateTable(),this.dispatchEvent(new CustomEvent("tableadvancedchange",{detail:{searchTerm:this.searchTerm,currentPage:this.currentPage},bubbles:!0,composed:!0})),this.requestUpdate())}},y.styles=v`:host{display:block;color:var(--md-sys-color-on-surface);font-family:var(--brand-font, Inter, Arial, sans-serif);--scb-background-row:var(--md-sys-color-surface)}scb-search{max-width:400px}.scb-table-scroll-wrapper{width:100%;overflow-x:auto;overflow-y:auto;max-width:100%;padding-bottom:24px}.scb-table-scroll-wrapper::-webkit-scrollbar{border-radius:var(--md-sys-shape-corner-large);height:8px;width:10px}.scb-table-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--md-sys-color-on-surface);border-radius:var(--md-sys-shape-corner-large);cursor:pointer}.scb-table-scroll-wrapper::-webkit-scrollbar-track{background:var(--md-sys-color-secondary-container);border-radius:var(--md-sys-shape-corner-large)}::slotted(table){border-collapse:collapse;border-spacing:0;border-radius:24px;min-width:100%;overflow:hidden}.pagination{margin-top:16px;display:flex;justify-self:center}::slotted(th) .scb-sort-icon{pointer-events:none}::slotted(th:hover) .scb-sort-icon{pointer-events:auto}`,y);b([p({type:String})],u.prototype,"searchTerm",void 0);b([p({type:Boolean,attribute:"with-pagination"})],u.prototype,"pagination",void 0);b([p({type:Boolean,attribute:"with-filtering-search"})],u.prototype,"filteringSearch",void 0);b([p({type:Boolean,attribute:"no-scroll"})],u.prototype,"noScroll",void 0);b([p({type:Number,attribute:"page-size"})],u.prototype,"pageSize",void 0);b([p({type:Number})],u.prototype,"currentPage",void 0);b([p({type:Number})],u.prototype,"totalRows",void 0);u=b([m("scb-table-advanced")],u);
+      `}_onSearchInput(e){const s=e.target.value;this.searchTerm=s,this._filterTable(),this.dispatchEvent(new CustomEvent("tableadvancedchange",{detail:{searchTerm:this.searchTerm,currentPage:this.currentPage},bubbles:!0,composed:!0}))}_filterTable(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;if(s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const i=t.querySelector("tbody");i&&(r=i)}}),!r)return;const o=r,a=this._getTopLevelRows(o),l=this.searchTerm.trim().toLowerCase();if(!l)this._filteredRows=null,a.forEach(t=>t.style.display=""),this._updateTotalRows(),this._ensureCurrentPageWithinBounds(),this.pagination&&this._paginateTable(),this._sortedColumn!==null&&this._sortTable(this._sortedColumn,this._sortDirection);else{this._filteredRows=a.filter(i=>this._getRowSearchText(i).toLowerCase().includes(l)),a.forEach(i=>i.style.display="none");let t=this._filteredRows;this._sortedColumn!==null&&(t=[...t],t.sort((i,h)=>{const d=this._getCellSortableValue(i.children[this._sortedColumn]),c=this._getCellSortableValue(h.children[this._sortedColumn]);return this._compareCellValues(d,c,this._sortDirection)}),this._filteredRows=t),this.totalRows=this._filteredRows.length,this._ensureCurrentPageWithinBounds(),this.pagination?this._paginateTable():this._filteredRows.forEach(i=>i.style.display="")}}firstUpdated(){const e=this.shadowRoot.querySelector("slot");e&&(e.addEventListener("slotchange",()=>this._attachThListeners()),this._attachThListeners(),this._attachTbodyObserver(),this._refreshFromTableContent())}updated(e){super.updated(e),(e.has("searchTerm")||e.has("currentPage")||e.has("pageSize")||e.has("filteringSearch")||e.has("pagination"))&&this.updateComplete.then(()=>{this.isConnected&&this._refreshFromTableContent()})}_disconnectTbodyObserver(){this._tbodyObserver&&(this._tbodyObserver.disconnect(),this._tbodyObserver=null),this._observedTbody=null}_attachTbodyObserver(){const e=this._getTbody();if(!e){this._disconnectTbodyObserver();return}this._observedTbody!==e&&(this._disconnectTbodyObserver(),this._observedTbody=e,this._tbodyObserver=new MutationObserver(()=>{this._suppressTbodyObserver||this._scheduleTableRefresh()}),this._tbodyObserver.observe(e,{childList:!0,subtree:!0,characterData:!0}))}_scheduleTableRefresh(){this._pendingTableRefresh||(this._pendingTableRefresh=!0,queueMicrotask(()=>{this._pendingTableRefresh=!1,this._refreshFromTableContent()}))}_refreshFromTableContent(){if(this._attachTbodyObserver(),this.filteringSearch){this._filterTable();return}if(this._updateTotalRows(),this._ensureCurrentPageWithinBounds(),this._sortedColumn!==null){this._sortTable(this._sortedColumn,this._sortDirection);return}this.pagination&&this._paginateTable()}_ensureCurrentPageWithinBounds(){const e=Math.max(1,Math.ceil(this.totalRows/this.pageSize)),s=Math.min(Math.max(1,this.currentPage),e);s!==this.currentPage&&(this.currentPage=s)}_getTbody(){const e=this.shadowRoot.querySelector("slot");if(!e)return null;const s=e.assignedNodes({flatten:!0});for(const r of s)if(r.nodeType===Node.ELEMENT_NODE){const o=r.querySelector("tbody");if(o)return o}return null}_getTopLevelRows(e){return Array.from(e.children).filter(s=>s instanceof HTMLTableRowElement)}_attachThListeners(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0}),r=[],o=[],a=[],l=[];s.forEach(t=>{t.nodeType===Node.ELEMENT_NODE&&(Array.from(t.querySelectorAll("thead")).forEach(i=>{r.push(...Array.from(i.querySelectorAll("th")))}),o.push(...t.querySelectorAll("th")),a.push(...t.querySelectorAll("td")),l.push(...t.querySelectorAll("tr")))}),o.forEach(t=>{const i=r.indexOf(t),h=i!==-1;t.style.textAlign="left",t.style.padding="16px 0px 16px 32px",t.style.position="relative",t.style.backgroundColor="var(--md-sys-color-surface)",t.style.fontFamily="var(--md-sys-typescale-label-medium-font)",t.style.fontSize="var(--md-sys-typescale-label-medium-size)",t.style.lineHeight="var(--md-sys-typescale-label-medium-line-height)",t.style.fontWeight="var(--md-sys-typescale-label-medium-weight)",t.style.letterSpacing="var(--md-sys-typescale-label-medium-tracking)",t.style.verticalAlign="bottom",this._removeGeneratedSortMarkup(t),t.hasAttribute("scope")||(h?t.setAttribute("scope","col"):t.closest("tbody")&&t.setAttribute("scope","row"));const d=this._getOrCreateHeaderLabel(t,i);if((d instanceof HTMLParagraphElement||d.getAttribute("data-scb-generated-label")==="true")&&this._applyGeneratedCellTextReset(d),!h){t.removeAttribute("aria-sort");return}t.setAttribute("aria-sort",this._getHeaderAriaSort(i));const c=this._getNormalizedText(d.textContent)||`kolumn ${Math.max(i,0)+1}`,n=document.createElement("scb-icon-button");n.className="scb-sort-icon",n.onclick=()=>this._onThClick(i),n.setAttribute("variant","standard"),n.setAttribute("size","small"),n.setAttribute("aria-label",this._getSortButtonLabel(c,i)),this._sortedColumn===i?(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)",n.style.alignSelf="end"),this._wrapHeaderWithSortControl(t,d,n)}),a.forEach(t=>{t.style.padding="16px 0px 16px 32px",t.style.textAlign="left",t.style.borderTop="1px solid var(--md-sys-color-outline-variant)",t.style.verticalAlign="text-top",t.style.backgroundColor="var(--md-sys-color-surface)",t.style.fontFamily="var(--md-sys-typescale-body-medium-font)",t.style.fontSize="var(--md-sys-typescale-body-medium-size)",t.style.lineHeight="var(--md-sys-typescale-body-medium-line-height)",t.style.fontWeight="var(--md-sys-typescale-body-medium-weight)",t.style.letterSpacing="var(--md-sys-typescale-body-medium-tracking)"}),l.forEach((t,i)=>{i%2===1&&t.querySelectorAll("td").forEach(c=>{c.style.backgroundColor="var(--scb-background-row)"});const h=t.querySelectorAll("th");h.length>0&&h.forEach((c,n)=>{n===0&&(c.style.paddingLeft="24px"),n===h.length-1?c.style.paddingRight="24px":c.style.paddingRight=""});const d=t.querySelectorAll("td");d.length>0&&d.forEach((c,n)=>{n===0&&(c.style.paddingLeft="24px"),n===d.length-1?c.style.paddingRight="24px":c.style.paddingRight=""})}),this.pagination&&this._paginateTable()}_applyGeneratedCellTextReset(e){e.style.margin="0",e.style.color="inherit",e.style.fontFamily="inherit",e.style.fontSize="inherit",e.style.lineHeight="inherit",e.style.fontWeight="inherit",e.style.letterSpacing="inherit"}_removeGeneratedSortMarkup(e){e.querySelectorAll("scb-icon-button.scb-sort-icon").forEach(o=>o.remove());const s=e.querySelector(':scope > [data-scb-sort-header="true"]');if(!(s instanceof HTMLElement))return;const r=s.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement){s.replaceWith(r);return}s.remove()}_getOrCreateHeaderLabel(e,s){const r=e.querySelector(':scope > [data-scb-sort-label="true"]');if(r instanceof HTMLElement)return r;const o=e.querySelector(":scope > p");if(o instanceof HTMLParagraphElement)return o.setAttribute("data-scb-sort-label","true"),o;const a=Array.from(e.children).find(t=>t instanceof HTMLElement&&!t.matches("scb-icon-button.scb-sort-icon"));if(a)return a.setAttribute("data-scb-sort-label","true"),a;const l=document.createElement("p");return l.setAttribute("data-scb-sort-label","true"),l.setAttribute("data-scb-generated-label","true"),l.textContent=this._getNormalizedText(e.textContent)||`kolumn ${Math.max(s,0)+1}`,e.textContent="",e.appendChild(l),l}_wrapHeaderWithSortControl(e,s,r){const o=document.createElement("div");o.setAttribute("data-scb-sort-header","true"),o.style.display="flex",o.style.gap="8px",o.style.flexWrap="nowrap",o.style.alignItems="center",o.appendChild(s),o.appendChild(r),e.appendChild(o)}_getNormalizedText(e){return(e??"").replace(/\s+/g," ").trim()}_onThClick(e){this._sortedColumn===e?this._sortDirection=this._sortDirection==="asc"?"desc":"asc":(this._sortedColumn=e,this._sortDirection="asc"),this._sortTable(e,this._sortDirection),this._attachThListeners()}_getHeaderAriaSort(e){return this._sortedColumn!==e?"none":this._sortDirection==="asc"?"ascending":"descending"}_getSortButtonLabel(e,s){return`Sortera ${e||`kolumn ${s+1}`} ${this._sortedColumn===s&&this._sortDirection==="asc"?"fallande":"stigande"}`}_sortTable(e,s){const r=this.shadowRoot.querySelector("slot");if(!r)return;const o=r.assignedNodes({flatten:!0});let a=null;if(o.forEach(i=>{if(i.nodeType===Node.ELEMENT_NODE){const h=i.querySelector("tbody");h&&(a=h)}}),!a)return;let l;this._filteredRows?l=[...this._filteredRows]:l=this._getTopLevelRows(a),l.sort((i,h)=>{const d=this._getCellSortableValue(i.children[e]),c=this._getCellSortableValue(h.children[e]);return this._compareCellValues(d,c,s)});const t=this._tbodyObserver!==null;t&&this._disconnectTbodyObserver();try{l.forEach(i=>a.appendChild(i))}finally{t&&this._attachTbodyObserver()}this._filteredRows&&(this._filteredRows=l,this.totalRows=this._filteredRows.length),this.pagination&&this._paginateTable()}_getRowSearchText(e){return Array.from(e.cells).map(s=>this._getCellSortableValue(s)).join(" ")}_getCellSortableValue(e){if(!e)return"";const s=e,r=this._getSortableAttributeValue(s);if(r)return r;const o=[],a=s.textContent?.replace(/\s+/g," ").trim();return a&&o.push(a),s.querySelectorAll("[data-sort-value], [data-sort], [aria-label], [label], [value], [title]").forEach(l=>{const t=this._getSortableAttributeValue(l);t&&!o.includes(t)&&o.push(t)}),o.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,s,r){const o=this._parseSortableNumber(e),a=this._parseSortableNumber(s);if(o!==null&&a!==null)return r==="asc"?o-a:a-o;const l=Date.parse(e.replace(/\s+/g," ")),t=Date.parse(s.replace(/\s+/g," "));if(!isNaN(l)&&!isNaN(t))return r==="asc"?l-t:t-l;const i=e.localeCompare(s,"sv");return r==="asc"?i:-i}_parseSortableNumber(e){const s=e.trim();if(!/^[+-]?(?:\d+|\d{1,3}(?:[\s\u00a0\u202f]\d{3})+)(?:[,.]\d+)?$/.test(s))return null;const r=Number(s.replace(/[\s\u00a0\u202f]/g,"").replace(",","."));return Number.isNaN(r)?null:r}_updateTotalRows(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;s.forEach(o=>{if(o.nodeType===Node.ELEMENT_NODE){const a=o.querySelector("tbody");a&&(r=a)}}),r&&(this.totalRows=this._getTopLevelRows(r).length,this._ensureCurrentPageWithinBounds())}_paginateTable(){const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedNodes({flatten:!0});let r=null;if(s.forEach(t=>{if(t.nodeType===Node.ELEMENT_NODE){const i=t.querySelector("tbody");i&&(r=i)}}),!r)return;let o;this._filteredRows?o=this._filteredRows:o=this._getTopLevelRows(r),this._getTopLevelRows(r).forEach(t=>t.style.display="none");const a=(this.currentPage-1)*this.pageSize,l=a+this.pageSize;o.slice(a,l).forEach(t=>t.style.display="")}_changePage(e){const s=Math.ceil(this.totalRows/this.pageSize);e<1||e>s||(this.currentPage=e,this._paginateTable(),this.dispatchEvent(new CustomEvent("tableadvancedchange",{detail:{searchTerm:this.searchTerm,currentPage:this.currentPage},bubbles:!0,composed:!0})),this.requestUpdate())}},y.styles=v`:host{display:block;color:var(--md-sys-color-on-surface);font-family:var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));--scb-background-row:var(--md-sys-color-surface)}scb-search{max-width:400px}.scb-table-scroll-wrapper{width:100%;overflow-x:auto;overflow-y:auto;max-width:100%;padding-bottom:24px}.scb-table-scroll-wrapper::-webkit-scrollbar{border-radius:var(--md-sys-shape-corner-large);height:8px;width:10px}.scb-table-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--md-sys-color-on-surface);border-radius:var(--md-sys-shape-corner-large);cursor:pointer}.scb-table-scroll-wrapper::-webkit-scrollbar-track{background:var(--md-sys-color-secondary-container);border-radius:var(--md-sys-shape-corner-large)}::slotted(table){border-collapse:collapse;border-spacing:0;border-radius:24px;font-family:var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));min-width:100%;overflow:hidden}.pagination{margin-top:16px;display:flex;justify-self:center}::slotted(th) .scb-sort-icon{pointer-events:none}::slotted(th:hover) .scb-sort-icon{pointer-events:auto}`,y);b([p({type:String})],u.prototype,"searchTerm",void 0);b([p({type:Boolean,attribute:"with-pagination"})],u.prototype,"pagination",void 0);b([p({type:Boolean,attribute:"with-filtering-search"})],u.prototype,"filteringSearch",void 0);b([p({type:Boolean,attribute:"no-scroll"})],u.prototype,"noScroll",void 0);b([p({type:Number,attribute:"page-size"})],u.prototype,"pageSize",void 0);b([p({type:Number})],u.prototype,"currentPage",void 0);b([p({type:Number})],u.prototype,"totalRows",void 0);u=b([m("scb-table-advanced")],u);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name":  "scb-wc",
-    "version":  "0.1.138",
+    "version":  "0.1.140",
     "type":  "module",
     "main":  "index.js",
     "module":  "index.js",
@@ -472,5 +472,5 @@
                                                         },
                     "./mvc/*":  "./mvc/*"
                 },
-    "buildHash":  "E70DD81152035DB4E1E93936D0D812D04F9805CA75E4EB971C4E8883D4FB98DB"
+    "buildHash":  "1633300CDB16E946D3529A66495B90FE93FD23235DDB328F641520CFBB204FD9"
 }

package/scb-table/scb-table.js

@@ -14,7 +14,7 @@ var o = 96, s = 32, c = class extends t {
     :host {
       display: block;
       color: var(--md-sys-color-on-surface);
-      font-family: var(--brand-font, Inter, Arial, sans-serif);
+      font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
     }
 
     .scb-table-scroll-wrapper {
@@ -45,6 +45,7 @@ var o = 96, s = 32, c = class extends t {
     ::slotted(table) {
       border-collapse: collapse;
       border-spacing: 0;
+      font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
       min-width: 100%;
       overflow: hidden;
     }

package/scb-table-advanced/scb-table-advanced.js

@@ -19,7 +19,7 @@ var o = class extends t {
       :host {
         display: block;
         color: var(--md-sys-color-on-surface);
-        font-family: var(--brand-font, Inter, Arial, sans-serif);
+        font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
         --scb-background-row: var(--md-sys-color-surface);
       }
       scb-search{
@@ -51,6 +51,7 @@ var o = class extends t {
         border-collapse: collapse;
         border-spacing: 0;
         border-radius: 24px;
+        font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
         min-width: 100%;
             overflow: hidden;
         /* Remove overflow: hidden to allow scroll */

package/scb-wc.bundle.js

@@ -14336,7 +14336,7 @@
     :host {
       display: block;
       color: var(--md-sys-color-on-surface);
-      font-family: var(--brand-font, Inter, Arial, sans-serif);
+      font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
     }
 
     .scb-table-scroll-wrapper {
@@ -14367,6 +14367,7 @@
     ::slotted(table) {
       border-collapse: collapse;
       border-spacing: 0;
+      font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
       min-width: 100%;
       overflow: hidden;
     }
@@ -14386,7 +14387,7 @@
       :host {
         display: block;
         color: var(--md-sys-color-on-surface);
-        font-family: var(--brand-font, Inter, Arial, sans-serif);
+        font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
         --scb-background-row: var(--md-sys-color-surface);
       }
       scb-search{
@@ -14418,6 +14419,7 @@
         border-collapse: collapse;
         border-spacing: 0;
         border-radius: 24px;
+        font-family: var(--md-sys-typescale-body-medium-font, var(--brand-font, Inter, Arial, sans-serif));
         min-width: 100%;
             overflow: hidden;
         /* Remove overflow: hidden to allow scroll */