@szum-tech/design-system
Version:
Szum-Tech design system with tailwindcss support
3 lines (2 loc) • 3.35 kB
JavaScript
"use client";
;var chunkZGDGO7ES_cjs=require('../../chunk-ZGDGO7ES.cjs');require('../../chunk-ERFTRXVE.cjs');var chunkD5PAWOAZ_cjs=require('../../chunk-D5PAWOAZ.cjs'),e=require('react'),radixUi=require('radix-ui'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var e__namespace=/*#__PURE__*/_interopNamespace(e);function ne(I){let{items:n,getBadgeLabel:m,lineCount:s=1,renderBadge:L,renderOverflow:p,asChild:z,className:W,style:F,ref:j,...O}=I,i=e__namespace.useCallback(t=>{if(typeof t=="object"&&!m)throw new Error("`getBadgeLabel` is required when using array of objects");return m?m(t):t},[m]),d=e__namespace.useRef(null),S=chunkZGDGO7ES_cjs.c(j,d),h=e__namespace.useRef(null),[b,q]=e__namespace.useState(0),[o,D]=e__namespace.useState(4),[H,V]=e__namespace.useState(20),[E,A]=e__namespace.useState(40),[J,K]=e__namespace.useState(false),[x,Q]=e__namespace.useState(new Map);e__namespace.useLayoutEffect(()=>{if(!d.current||!h.current)return;function t(){if(!d.current||!h.current)return;let r=getComputedStyle(d.current),l=r.gap,c=l?parseFloat(l):4;D(c);let y=parseFloat(r.paddingLeft)||0,R=parseFloat(r.paddingRight)||0,g=y+R,v=new Map,f=h.current.children;for(let B=0;B<n.length;B++){let k=f[B];if(k){let Z=i(n[B]);v.set(Z,k.offsetWidth);}}Q(v);let w=f[0];w&&V(w.offsetHeight||20);let P=f[n.length];P&&A(P.offsetWidth||40);let Y=d.current.clientWidth-g;q(Y),K(true);}t();let a=new ResizeObserver(t);return a.observe(d.current),()=>{a.disconnect();}},[n,i]);let U=e__namespace.useMemo(()=>H*s+o*(s-1),[H,o,s]),{visibleItems:X,hiddenCount:T}=e__namespace.useMemo(()=>{if(!b||n.length===0||x.size===0)return {visibleItems:n,hiddenCount:0};let t=0,a=1,r=[];for(let l=0;l<n.length;l++){let c=n[l];if(!c)continue;let y=i(c),R=x.get(y);if(!R)continue;let g=R+o,v=a===s,f=l<n.length-1,w=v&&f?b-E-o:b;if(t+g<=w)t+=g,r.push(c);else if(a<s)a++,t=g,r.push(c);else break}return {visibleItems:r,hiddenCount:Math.max(0,n.length-r.length)}},[n,i,b,s,o,E,x]),N=z?radixUi.Slot.Slot:"div";return jsxRuntime.jsxs(e__namespace.Fragment,{children:[jsxRuntime.jsxs("div",{ref:h,className:"pointer-events-none invisible absolute flex flex-wrap",style:{gap:o},children:[n.map((t,a)=>jsxRuntime.jsx(e__namespace.Fragment,{children:L(t,i(t))},a)),p?p(99):jsxRuntime.jsx("div",{className:"inline-flex h-5 shrink-0 items-center rounded-md border px-1.5 text-xs font-semibold",children:"+99"})]}),J?jsxRuntime.jsxs(N,{"data-slot":"badge-overflow",...O,ref:S,className:chunkD5PAWOAZ_cjs.a("flex flex-wrap",W),style:{gap:o,...F},children:[X.map((t,a)=>jsxRuntime.jsx(e__namespace.Fragment,{children:L(t,i(t))},a)),T>0&&(p?p(T):jsxRuntime.jsxs("div",{className:"inline-flex h-5 shrink-0 items-center rounded-md border px-1.5 text-xs font-semibold",children:["+",T]}))]}):jsxRuntime.jsx(N,{"data-slot":"badge-overflow",...O,ref:S,className:chunkD5PAWOAZ_cjs.a("flex flex-wrap",W),style:{gap:o,minHeight:U,...F},children:n.slice(0,Math.min(n.length,s*3-(s>1?1:0))).map((t,a)=>jsxRuntime.jsx(e__namespace.Fragment,{children:L(t,i(t))},a))})]})}exports.BadgeOverflow=ne;