@n8d/htwoo-core
Version:
hTWOo is a Fluent Design Framework purely in HTML and CSS
2 lines (1 loc) • 1.95 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).htwoo=t.htwoo||{},t.htwoo.table={}))}(this,(function(t){"use strict";var e;!function(t){t.LEFT="left",t.RIGHT="right",t.TOP="top",t.BOTTOM="bottom"}(e||(e={}));const s=t=>{const e=t.target,s=e.closest("tr");if(!s)return;const l=e.closest("table");if(!l)return;const o=s.dataset.sectionheader;if(!o)return;let i;i="all"===o?"tr[data-section]":`tr[data-section=${o}]`;const r=l.querySelectorAll(i);for(let t=0;t<r.length;t++){const e=r[t];e.classList.contains("is-hidden")?(e.classList.remove("is-hidden"),e.classList.add("is-visible"),e.setAttribute("aria-hidden","false"),s.setAttribute("aria-expanded","true")):(e.classList.add("is-hidden"),e.classList.remove("is-visible"),e.setAttribute("aria-hidden","true"),s.setAttribute("aria-expanded","false"))}if("all"===o){const t=document.querySelectorAll("tbody tr.collapsable");if("true"===s.getAttribute("aria-expanded"))for(let e=0;e<t.length;e++){const s=t[e];s.setAttribute("aria-hidden","false"),s.setAttribute("aria-expanded","true")}else for(let e=0;e<t.length;e++){const s=t[e];s.setAttribute("aria-hidden","true"),s.setAttribute("aria-expanded","false")}}};e.LEFT,e.RIGHT,e.TOP,e.BOTTOM;const l=(t,s,l)=>{const o=t.querySelectorAll(s);for(let t=0;t<o.length;t++){const s=o[t];l===e.LEFT&&(s.style[l]=s.offsetLeft+"px"),l===e.RIGHT&&(s.style[l]=s.offsetRight+"px"),l===e.TOP&&(s.style[l]=s.offsetTop+"px"),l===e.BOTTOM&&(s.style[l]=s.offsetBottom+"px")}};t.initTables=()=>{document.querySelectorAll(".hoo-table.is-collapsable").forEach((t=>{t.querySelectorAll(".collapsable").forEach((t=>{t.addEventListener("click",s)}))})),(()=>{const t=document.querySelectorAll("table.sticky");for(let s=0;s<t.length;s++){const o=t[s];l(o,"tr td.is-sticky.left",e.LEFT),l(o,"tr th.is-sticky.left",e.LEFT)}})()}}));