@n8d/htwoo-core
Version:
hTWOo is a Fluent Design Framework purely in HTML and CSS
2 lines (1 loc) • 1.48 kB
JavaScript
define(["exports"],(function(e){"use strict";const t=[],l=(e,l)=>{e.target.parentElement.querySelectorAll(".hoo-overflow > *");((e,l,r,o)=>{let n=t[o].filter((t=>t.overallWidth>e-40)),i=t[o].filter((t=>t.overallWidth<e-40)),h=r.querySelector(".hoo-buttonicon-overflow .hoo-buttonflyout");if(h&&h.children.length<n.length)for(let e=0;e<n.length;e++)if(null!==r.querySelector("[data-ref="+n[e].ref+"]")){let t=document.createElement("li");t.appendChild(r.querySelector("[data-ref="+n[e].ref+"]")),h.appendChild(t)}var c;if(0!==h.children.length?(c=h.closest(".hoo-buttonicon-overflow"))&&c.classList.add("is-active"):(c=h.closest(".hoo-buttonicon-overflow"))&&c.classList.remove("is-active"),h&&h.children.length>n.length)for(let e=0;e<i.length;e++)if(null!==h.querySelector("[data-ref="+i[e].ref+"]")){let t=h.querySelector("[data-ref="+i[e].ref+"]");r.appendChild(t)}for(let e=0;e<h.children.length;e++)0===h.children[e].children.length&&h.children[e].remove()})(e.target.parentElement.clientWidth,0,e.target,l)},r=(e,t)=>{e.forEach(((e,t)=>{o(e.target.children,t),l(e,t)}))},o=(e,l)=>{let r=0;if(t.length<=l){t[l]=[];for(let o=0;o<e.length;o++)if(r+=e[o].clientWidth,!e[o].classList.contains("hoo-buttonicon-overflow")){let n={chlld:e[o],ref:"ref-"+l+"-"+o,width:e[o].clientWidth,overallWidth:r};e[o].dataset.ref=n.ref,t[l].push(n)}}};e.init=()=>{let e=document.querySelectorAll(".hoo-overflow");if(0!==e.length){const t=new ResizeObserver(r);e.forEach((e=>{t.observe(e)}))}}}));