@zvoove/unity-ui 2.29.0 → 2.29.1

package/dist/unity-ui.es.js

@@ -722,8 +722,8 @@ return x("label",{htmlFor:C,className:`cursor-pointer ${Z?"w-full":"w-fit"} inli
 /* @__PURE__ */b("span",{className:qH({checked:e,disabled:a}),children:[/* @__PURE__ */x("input",{id:C,name:l,value:n,type:"checkbox",checked:e,"aria-checked":e,"aria-disabled":a,disabled:a,onChange:V,onKeyDown:a=>{"Space"===a.key&&(a.preventDefault(),a.stopPropagation(),V({target:{checked:e}}))},className:"sr-only",ref:d,tabIndex:a?-1:0,...m}),/* @__PURE__ */b("div",{className:YH({checked:e,animate:h,disabled:a,withIcons:null!==f}),children:[f&&e&&/* @__PURE__ */x("div",{className:"z-1","data-testid":"icon-on",children:/* @__PURE__ */x(wd,{name:f.on,size:"2xs"})}),f&&!e&&/* @__PURE__ */x("div",{className:"z-1","data-testid":"icon-off",children:/* @__PURE__ */x(wd,{name:f.off,size:"2xs"})})]})]}),g&&"right"===s&&/* @__PURE__ */b(_p,{variant:"body",size:"large",children:["string"==typeof o&&o,"object"==typeof o&&/* @__PURE__ */x(M,{children:e?o.on:o.off})]})]})})});XH.displayName="Switch";var KH=Ja({base:["overflow-x-auto"]}),JH=Ja({base:["table-auto","w-full"]}),QH=Ja({base:["py-md","px-sm","border-b","border-outline-variant","max-mobile:hidden"],variants:{hasBackgroundColor:{true:["bg-surface-container-low"]}}}),eC=Ja({base:["text-body-medium","not-last:border-b","transition-colors","transition-all","border-outline-variant","[&+tr]:transition-all","[&+tr]:duration-200","[&+tr]:ease-in-out","mobile:hover:bg-surface-container-lowest","max-mobile:block","max-mobile:odd:bg-surface-container-lowest"],variants:{isSubRow:{true:["border-b-0!","hover:bg-transparent"]},isLastWithSubRow:{true:["border-b-0!"]},isOpen:{true:["[&+tr]:border-t","[&+tr]:border-outline-variant"]},isSubRowOpen:{true:["bg-surface-container-lowest"]}}}),aC=Ja({base:["p-sm","relative","max-mobile:p-xs","max-mobile:inline-flex","max-mobile:w-full","max-mobile:justify-between","max-mobile:before:content-[attr(data-label)]","max-mobile:before:text-label-large","max-mobile:gap-sm"],variants:{variant:{header:["not-last:after:absolute","not-last:after:right-[0px]","not-last:after:top-1/2","not-last:after:-translate-y-1/2","not-last:after:w-px","not-last:after:h-[12px]","not-last:after:bg-outline-variant"]},orderable:{true:["cursor-pointer"]}}}),tC="asc",lC="desc",nC="left",rC="center",iC="right",oC=e=>{let a="flex-start";return e===iC&&(a="flex-end"),e===rC&&(a="center"),e===nC&&(a="flex-start"),a},sC=({data:e,columns:t,title:l,subtitle:n,actions:r,filters:i,footer:o,orderBy:s,onOrderByChange:c,emptyState:m,hiddenColumns:d,loading:h=!1,expandedRows:p,headerBackgroundColor:u=!1})=>{const{isSmallerThan:H}=ue(),C=t.filter(e=>!d?.includes(e.id));/* @__PURE__ */
 return b(Wm,{variant:"outlined",padding:"none",overflow:"hidden",children:[(r||l)&&/* @__PURE__ */b(M,{children:[/* @__PURE__ */b(CH,{padding:{y:"xs",x:"md"},direction:{minimum:"column",mobile:"row"},justify:"space-between",align:"center",children:[l?/* @__PURE__ */x(M,{children:l&&/* @__PURE__ */b(CH,{gap:"none",padding:{y:"xs"},children:[/* @__PURE__ */x(_p,{variant:"title",size:"large",as:"h1",children:l}),n&&/* @__PURE__ */x(_p,{color:"on-surface-variant",children:n})]})}):/* @__PURE__ */x("div",{}),/* @__PURE__ */x("div",{children:/* @__PURE__ */x(CH,{direction:"row",gap:"none",children:r})})]}),/* @__PURE__ */x(Fh,{})]}),i&&/* @__PURE__ */b(M,{children:[/* @__PURE__ */x(CH,{padding:"md",direction:"row",gap:"sm",align:"center",children:i}),/* @__PURE__ */x(Fh,{})]}),
 /* @__PURE__ */x("div",{className:KH(),children:/* @__PURE__ */b("table",{className:JH(),children:[/* @__PURE__ */x("thead",{children:/* @__PURE__ */x("tr",{className:QH({hasBackgroundColor:u}),children:C.map(e=>/* @__PURE__ */x("th",{className:aC({variant:"header",orderable:e.orderable}),style:{width:e.width,minWidth:e.minWidth,textAlign:e.align??nC},role:e.orderable?"button":void 0,tabIndex:e.orderable?0:void 0,onClick:()=>{e.orderable&&c?.({columnId:e.id,direction:s?.direction===tC?lC:tC})},children:/* @__PURE__ */b(CH,{direction:"row",gap:"xs",align:"center",justify:oC(e.align??nC),children:[/* @__PURE__ */x(_p,{variant:"label",size:"large",wrap:!1,as:"span",children:e.label}),e.orderable&&/* @__PURE__ */x(wd,{name:s?.column===e.id?s.direction===tC?"arrow-up":"arrow-down":"minus",size:"sm",color:"on-surface"})]})},`${e.id}-header`))})}),/* @__PURE__ */x("tbody",{children:h?/* @__PURE__ */x(M,{children:Array.from({length:10}).map((e,a)=>/* @__PURE__ */x("tr",{className:eC(),children:C.map(e=>/* @__PURE__ */x("td",{className:aC(),align:e.align??nC,children:/* @__PURE__ */x(IH,{width:`${Math.floor(61*Math.random())+40}%`})},`${e.id}-row-loading`))},`row-loading-${a}`))}):e.length>0?e.map((t,l)=>{const n=l===e.length-1,r=!!t.expandableRow,i=n&&r,o=p?.includes(t.expandableRow?.id??"");/* @__PURE__ */
-return b(a.Fragment,{children:[/* @__PURE__ */x("tr",{className:eC({isLastWithSubRow:i&&!o,isSubRowOpen:o}),children:C.map(e=>{const a=t[e.id];let n;return n="string"==typeof a?/* @__PURE__ */x(_p,{variant:"body",as:"span",textAlign:H("tablet")?iC:e.align??nC,children:a}):a,/* @__PURE__ */x("td",{className:aC(),align:e.align??nC,"data-label":e.label,children:n},`${e.id}-row-${l}`)})},`row-${l}`),t.expandableRow&&/* @__PURE__ */x("tr",{className:eC({isSubRow:!0,isOpen:p?.includes(t.expandableRow?.id??"")}),"data-type":"expandable-row",children:/* @__PURE__ */x("td",{colSpan:C.length,align:nC,children:/* @__PURE__ */x(Cd,{isOpen:p?.includes(t.expandableRow?.id??""),children:/* @__PURE__ */x("div",{className:aC(),children:t.expandableRow.render})})})},t.expandableRow.id?`expandable-row-${t.expandableRow.id}`:`expandable-row-${l}`)]},`row-fragment-${l}`)}):/* @__PURE__ */x("tr",{children:/* @__PURE__ */x("td",{colSpan:t.length,className:aC(),align:rC,children:m||/* @__PURE__ */x(_p,{variant:"body",as:"span",children:"Keine Daten gefunden"})})})})]})}),o&&/* @__PURE__ */b(M,{children:[/* @__PURE__ */x(Fh,{}),/* @__PURE__ */x(CH,{padding:"md",children:o})]})]})};sC.displayName="Table";var cC=Ja({base:["w-full","relative"]}),mC=Ja({base:["w-full","p-md"],variants:{active:{true:["block"],false:["hidden"]}}}),dC=Ja({base:["w-full","relative"],variants:{hasArrows:{true:["px-[24px]"]},hideBorder:{true:["border-none"],false:["border-b","border-b-surface-container-highest"]},isSticky:{true:["sticky","top-none","z-10","bg-surface/50","backdrop-blur","z-9"]}}}),hC=Ja({base:["w-full","overflow-x-auto","overflow-y-hidden","scrollbar-hidden ","relative"]}),pC=Ja({base:["flex","gap-md","relative"],variants:{hasArrows:{false:["px-[24px]","w-full"],true:["w-fit"]},itemsAlignment:{left:["justify-start"],center:["justify-center"],right:["justify-end"],between:["justify-between"],around:["justify-around"],evenly:["justify-evenly"]}}}),uC=Ja({base:["cursor-pointer","transition-colors","duration-300","px-md","py-sm","whitespace-nowrap"],variants:{active:{false:["hover:bg-on-surface/8"],true:["hover:bg-primary/8"]},activity:{true:["relative","after:absolute","after:bottom-1/2","after:translate-y-1/2","after:right-[4px]","after:size-[6px]","after:shrink-0","after:rounded-full","after:bg-primary"]}}}),HC=Ja({base:["absolute","bottom-none","h-[3px]","rounded-t-lg","z-10","bg-primary"],variants:{initial:{true:["transition-none"],false:["transition-[left,width]","duration-300","ease-in-out"]}},defaultVariants:{initial:!1}}),CC=Ja({base:["absolute","top-none","cursor-pointer","h-full","w-[24px]","flex","items-center","justify-center","z-50","transition-all","duration-300","hover:bg-on-surface/8"],variants:{direction:{left:["left-none"],right:["right-none"]},visible:{true:["opacity-100","pointer-events-auto"],false:["opacity-0","pointer-events-none"]}}}),gC=({item:e,activeItem:a,onChange:t,hasActivity:l,scrollContainerRef:n,tabRefs:r,setTabRef:i,index:s,linkComponent:c="button",isActive:m})=>/* @__PURE__ */o(c,{...e,key:e.id,ref:e=>{i(s,e)},role:"tab","aria-selected":m,"aria-controls":`tab-panel-${e.id}`,onClick:()=>{if(t?.({...e,hasActivity:l}),n.current&&r?.current){const e=r.current[s],a=n.current,t=a.clientWidth,l=e.offsetLeft-t/2+e.offsetWidth/2;a.scrollTo({left:l,behavior:"smooth"})}},className:uC({active:m,activity:l})},/* @__PURE__ */x(CH,{direction:"row",align:"center",gap:"sm",children:/* @__PURE__ */b(CH,{direction:"top"===e.iconPosition?"column":"row",align:"center",gap:"top"===e.iconPosition?"xs2":"xs",children:[e.icon&&/* @__PURE__ */x(wd,{name:e.icon,size:"sm",color:m?"primary":"on-surface-variant"}),!e.hideLabel&&/* @__PURE__ */x(_p,{as:"span",variant:"title",size:"small",color:e.id===a?"primary":"on-surface-variant",children:e.label})]})})),VC=({items:e,activeItem:a,onChange:t,hideBorder:l=!1,itemsAlignment:n="left",isSticky:r=!0,panels:i,linkComponent:o="button"})=>{const[s,c]=v({left:!1,right:!1}),[m,h]=v({left:0,width:0}),[p,H]=v(!0),C=Z([]),g=Z(null),V=Z(null),f=Z(null),A=()=>{if(f.current){const{scrollLeft:e,scrollWidth:a,clientWidth:t}=f.current;c({left:e>0,right:e<a-t-1})}};u(()=>{const e=f.current;if(e){e.addEventListener("scroll",A);const a=new ResizeObserver(()=>{A()});return a.observe(e),()=>{e.removeEventListener("scroll",A),a.disconnect()}}},[]),u(()=>{const t=e.findIndex(e=>e.id===a),l=C.current[t];if(l){const{offsetLeft:e,offsetWidth:a}=l;p?requestAnimationFrame(()=>{h({left:e+16,width:a-32});const t=setTimeout(()=>{H(!1)},300);return()=>clearTimeout(t)}):h({left:e+16,width:a-32})}},[a,e,s,n,p]),u(()=>{if(V.current&&g.current){const{width:e}=g.current.getBoundingClientRect(),{width:a}=V.current.getBoundingClientRect();a>e&&d(()=>{c({left:!1,right:!0})})}},[V,g,e]);const M=e=>{if(f.current){const{clientWidth:a}=f.current,t=.5*a,l="left"===e?f.current.scrollLeft-t:f.current.scrollLeft+t;f.current.scrollTo({left:l,behavior:"smooth"})}},w=(e,a)=>{C.current&&(C.current[e]=a)};/* @__PURE__ */
-return b("div",{className:cC(),children:[/* @__PURE__ */b("div",{className:dC({hasArrows:s.left||s.right,hideBorder:l,isSticky:r}),ref:g,children:[
+return b(a.Fragment,{children:[/* @__PURE__ */x("tr",{className:eC({isLastWithSubRow:i&&!o,isSubRowOpen:o}),children:C.map(e=>{const a=t[e.id];let n;return n="string"==typeof a?/* @__PURE__ */x(_p,{variant:"body",as:"span",textAlign:H("tablet")?iC:e.align??nC,children:a}):a,/* @__PURE__ */x("td",{className:aC(),align:e.align??nC,"data-label":e.label,children:n},`${e.id}-row-${l}`)})},`row-${l}`),t.expandableRow&&/* @__PURE__ */x("tr",{className:eC({isSubRow:!0,isOpen:p?.includes(t.expandableRow?.id??"")}),"data-type":"expandable-row",children:/* @__PURE__ */x("td",{colSpan:C.length,align:nC,children:/* @__PURE__ */x(Cd,{isOpen:p?.includes(t.expandableRow?.id??""),children:/* @__PURE__ */x("div",{className:aC(),children:t.expandableRow.render})})})},t.expandableRow.id?`expandable-row-${t.expandableRow.id}`:`expandable-row-${l}`)]},`row-fragment-${l}`)}):/* @__PURE__ */x("tr",{children:/* @__PURE__ */x("td",{colSpan:t.length,className:aC(),align:rC,children:m||/* @__PURE__ */x(_p,{variant:"body",as:"span",children:"Keine Daten gefunden"})})})})]})}),o&&/* @__PURE__ */b(M,{children:[/* @__PURE__ */x(Fh,{}),/* @__PURE__ */x(CH,{padding:"md",children:o})]})]})};sC.displayName="Table";var cC=Ja({base:["w-full","relative"],variants:{isSticky:{true:["sticky","top-none","z-10"],false:["relative"]}}}),mC=Ja({base:["w-full","p-md"],variants:{active:{true:["block"],false:["hidden"]}}}),dC=Ja({base:["w-full","relative"],variants:{hasArrows:{true:["px-xl"]},hideBorder:{true:["border-none"],false:["border-b","border-b-surface-container-highest"]},isSticky:{true:["sticky","top-none","bg-surface/50","backdrop-blur","z-10"]}}}),hC=Ja({base:["w-full","overflow-x-auto","overflow-y-hidden","scrollbar-hidden ","relative"]}),pC=Ja({base:["flex","gap-md","relative"],variants:{hasArrows:{false:["px-xl","w-full"],true:["w-fit"]},itemsAlignment:{left:["justify-start"],center:["justify-center"],right:["justify-end"],between:["justify-between"],around:["justify-around"],evenly:["justify-evenly"]}}}),uC=Ja({base:["cursor-pointer","transition-colors","duration-300","px-md","py-sm","whitespace-nowrap"],variants:{active:{false:["hover:bg-on-surface/8"],true:["hover:bg-primary/8"]},activity:{true:["relative","after:absolute","after:bottom-1/2","after:translate-y-1/2","after:right-xs2","after:size-xs","after:shrink-0","after:rounded-full","after:bg-primary"]}}}),HC=Ja({base:["absolute","bottom-none","h-[3px]","rounded-t-lg","z-10","bg-primary"],variants:{initial:{true:["transition-none"],false:["transition-[left,width]","duration-300","ease-in-out"]}},defaultVariants:{initial:!1}}),CC=Ja({base:["absolute","top-none","cursor-pointer","h-full","w-xl","flex","items-center","justify-center","z-50","transition-all","duration-300","hover:bg-on-surface/8"],variants:{direction:{left:["left-none"],right:["right-none"]},visible:{true:["opacity-100","pointer-events-auto"],false:["opacity-0","pointer-events-none"]}}}),gC=({item:e,activeItem:a,onChange:t,hasActivity:l,scrollContainerRef:n,tabRefs:r,setTabRef:i,index:s,linkComponent:c="button",isActive:m})=>/* @__PURE__ */o(c,{...e,key:e.id,ref:e=>{i(s,e)},role:"tab","aria-selected":m,"aria-controls":`tab-panel-${e.id}`,onClick:()=>{if(t?.({...e,hasActivity:l}),n.current&&r?.current){const e=r.current[s],a=n.current,t=a.clientWidth,l=e.offsetLeft-t/2+e.offsetWidth/2;a.scrollTo({left:l,behavior:"smooth"})}},className:uC({active:m,activity:l})},/* @__PURE__ */x(CH,{direction:"row",align:"center",gap:"sm",children:/* @__PURE__ */b(CH,{direction:"top"===e.iconPosition?"column":"row",align:"center",gap:"top"===e.iconPosition?"xs2":"xs",children:[e.icon&&/* @__PURE__ */x(wd,{name:e.icon,size:"sm",color:m?"primary":"on-surface-variant"}),!e.hideLabel&&/* @__PURE__ */x(_p,{as:"span",variant:"title",size:"small",color:e.id===a?"primary":"on-surface-variant",children:e.label})]})})),VC=({items:e,activeItem:a,onChange:t,hideBorder:l=!1,itemsAlignment:n="left",isSticky:r=!0,panels:i,linkComponent:o="button"})=>{const[s,c]=v({left:!1,right:!1}),[m,h]=v({left:0,width:0}),[p,H]=v(!0),C=Z([]),g=Z(null),V=Z(null),f=Z(null),A=()=>{if(f.current){const{scrollLeft:e,scrollWidth:a,clientWidth:t}=f.current;c({left:e>0,right:e<a-t-1})}};u(()=>{const e=f.current;if(e){e.addEventListener("scroll",A);const a=new ResizeObserver(()=>{A()});return a.observe(e),()=>{e.removeEventListener("scroll",A),a.disconnect()}}},[]),u(()=>{const t=e.findIndex(e=>e.id===a),l=C.current[t];if(l){const{offsetLeft:e,offsetWidth:a}=l;p?requestAnimationFrame(()=>{h({left:e+16,width:a-32});const t=setTimeout(()=>{H(!1)},300);return()=>clearTimeout(t)}):h({left:e+16,width:a-32})}},[a,e,s,n,p]),u(()=>{if(V.current&&g.current){const{width:e}=g.current.getBoundingClientRect(),{width:a}=V.current.getBoundingClientRect();a>e&&d(()=>{c({left:!1,right:!0})})}},[V,g,e]);const M=e=>{if(f.current){const{clientWidth:a}=f.current,t=.5*a,l="left"===e?f.current.scrollLeft-t:f.current.scrollLeft+t;f.current.scrollTo({left:l,behavior:"smooth"})}},w=(e,a)=>{C.current&&(C.current[e]=a)};/* @__PURE__ */
+return b("div",{className:cC({isSticky:r}),children:[/* @__PURE__ */b("div",{className:dC({hasArrows:s.left||s.right,hideBorder:l,isSticky:r}),ref:g,children:[
 /* @__PURE__ */x("button",{className:CC({direction:"left",visible:s.left}),onClick:()=>M("left"),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||M("left")},"aria-label":"Scroll left",children:/* @__PURE__ */x(wd,{name:"chevron-left",size:"sm",color:"on-surface-variant"})}),
 /* @__PURE__ */x("button",{className:CC({direction:"right",visible:s.right}),onClick:()=>M("right"),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||M("right")},"aria-label":"Scroll right",children:/* @__PURE__ */x(wd,{name:"chevron-right",size:"sm",color:"on-surface-variant"})}),
 /* @__PURE__ */x("div",{className:hC(),ref:f,children:/* @__PURE__ */b("div",{className:pC({hasArrows:s.left||s.right,itemsAlignment:n}),ref:V,role:"tablist",children:[e.map(({hasActivity:e,...l},n)=>/* @__PURE__ */x(gC,{item:l,activeItem:a,onChange:t,hasActivity:e,index:n,linkComponent:o,isActive:l.id===a,scrollContainerRef:f,tabRefs:C,setTabRef:w},l.id)),/* @__PURE__ */x("div",{className:HC({initial:p}),style:{left:`${m.left}px`,width:`${m.width}px`}})]})})]}),i?.map(e=>/* @__PURE__ */x("div",{className:mC({active:e.id===a}),children:e.children},e.id))]})};VC.displayName="Tabs";var fC=Ja({base:["w-fit","flex","justify-center","items-center","border","gap-xs","text-nowrap"],variants:{variant:{solid:["border-transparent!"],outlined:["bg-transparent!"],ghost:["bg-transparent!","border-transparent!"]},size:{large:["text-label-large","h-[32px]","px-md","rounded-sm"],medium:["text-label-medium","h-[24px]","px-sm","rounded-sm"],small:["text-label-small","h-[18px]","px-xs","rounded-xs"]},color:{green:["border-dark-green"],yellow:["border-dark-yellow"],pink:["border-dark-pink"],"steel-blue":["border-dark-steel-blue"],error:["border-error"],primary:["border-primary"],neutral:["border-outline"]},tone:{light:[],dark:[]}},compoundVariants:[{color:"green",tone:"light",variant:"solid",class:["bg-green-container","text-on-green-container"]},{color:"green",tone:"dark",variant:"solid",class:["bg-dark-green","text-on-dark-green"]},{color:"green",variant:"outlined",class:["text-on-green-container"]},{color:"green",variant:"ghost",class:["text-dark-green"]},{color:"yellow",tone:"light",variant:"solid",class:["bg-yellow-container","text-on-yellow-container"]},{color:"yellow",tone:"dark",variant:"solid",class:["bg-dark-yellow","text-on-dark-yellow"]},{color:"yellow",variant:"outlined",class:["text-on-yellow-container"]},{color:"yellow",variant:"ghost",class:["text-dark-yellow"]},{color:"pink",tone:"light",variant:"solid",class:["bg-pink-container","text-on-pink-container"]},{color:"pink",tone:"dark",variant:"solid",class:["bg-dark-pink","text-on-dark-pink"]},{color:"pink",variant:"outlined",class:["text-on-pink-container"]},{color:"pink",variant:"ghost",class:["text-dark-pink"]},{color:"steel-blue",tone:"light",variant:"solid",class:["bg-steel-blue-container","text-on-steel-blue-container"]},{color:"steel-blue",tone:"dark",variant:"solid",class:["bg-dark-steel-blue","text-on-dark-steel-blue"]},{color:"steel-blue",variant:"outlined",class:["text-on-steel-blue-container"]},{color:"steel-blue",variant:"ghost",class:["text-dark-steel-blue"]},{color:"error",tone:"light",variant:"solid",class:["bg-error-container","text-on-error-container"]},{color:"error",tone:"dark",variant:"solid",class:["bg-error","text-on-error"]},{color:"error",variant:"outlined",class:["text-on-error-container"]},{color:"error",variant:"ghost",class:["text-error"]},{color:"primary",tone:"light",variant:"solid",class:["bg-primary-container","text-on-primary-container"]},{color:"primary",tone:"dark",variant:"solid",class:["bg-primary","text-on-primary"]},{color:"primary",variant:"outlined",class:["text-on-primary-container"]},{color:"primary",variant:"ghost",class:["text-primary"]},{color:"neutral",tone:"light",variant:"solid",class:["bg-surface-container","text-inverse-surface"]},{color:"neutral",tone:"dark",variant:"solid",class:["bg-on-surface-variant","text-inverse-on-surface"]},{color:"neutral",variant:"outlined",class:["text-inverse-surface"]},{color:"neutral",variant:"ghost",class:["text-inverse-surface"]}]}),ZC=s(({label:e,variant:a="solid",size:t="medium",color:l="primary",tone:n="light",icon:r,...i},o)=>/* @__PURE__ */b("span",{ref:o,className:fC({variant:a,size:t,color:l,tone:n}),...i,children:[r&&/* @__PURE__ */x(wd,{name:r,size:"xs"})," ",e]})),vC=Ja({base:["flex","flex-col","gap-xs2","p-md","relative","w-full","border","border-outline","transition-colors","ease-in-out","text-on-surface","bg-surface"],variants:{borderRadius:{none:"rounded-none",sm:"rounded-sm",md:"rounded-md",lg:"rounded-lg",xl:"rounded-xl"},disabled:{true:["opacity-50","cursor-not-allowed","bg-surface-container-low"],false:[]},error:{true:["border-error"],false:[]}},compoundVariants:[{disabled:!1,error:!1,class:["hover:border-on-surface-variant","hover:bg-surface-container-low!","focus-within:border-primary!","focus-within:bg-surface-container-low"]},{disabled:!1,error:!0,class:["hover:bg-surface-container-low!","focus-within:bg-surface-container-low"]}]}),AC=Ja({base:["w-full","pb-xs"]}),MC=Ja({base:["grid","text-body-medium","[&>textarea]:text-inherit","after:text-inherit","[&>textarea]:resize-none","[&>textarea]:overflow-hidden","[&>textarea]:[grid-area:1/1/2/2]","after:[grid-area:1/1/2/2]","after:whitespace-pre-wrap","after:invisible","after:content-[attr(data-cloned-val)_'_']"]}),xC=Ja({base:["appearance-none","text-body-medium","text-on-surface","placeholder:text-on-surface-variant-lowest","disabled:opacity-50","disabled:cursor-not-allowed","focus:outline-none","focus:ring-0","p-none"],variants:{error:{true:["caret-error"],false:["caret-primary"]}}}),bC=s(({value:e,error:a=!1,errorMessage:t,disabled:l=!1,maxLength:n,borderRadius:r="sm",header:i,rows:o=1,actions:s,...c},m)=>{const d=Z(null);/* @__PURE__ */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zvoove/unity-ui",
-  "version": "2.29.0",
+  "version": "2.29.1",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/zvoove-org/unity-ui.git"
@@ -98,7 +98,7 @@
     "terser": "^5.46.2",
     "typescript": "^5.9.3",
     "vite": "^8.0.10",
-    "vite-plugin-dts": "^5.0.0",
+    "vite-plugin-dts": "^4.5.4",
     "vite-plugin-static-copy": "^4.1.0",
     "vitest": "^4.0.7"
   },

package/dist/components/Accordion/Accordion.d.ts

@@ -1,6 +0,0 @@
-import { AccordionItem, AccordionProps } from './Accordion.types';
-declare const Accordion: {
-    <T extends readonly AccordionItem[]>({ items, onToggle, openItems, allowMultipleOpenItems, }: AccordionProps<T>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default Accordion;

package/dist/components/Accordion/Accordion.styled.d.ts

@@ -1,46 +0,0 @@
-export declare const accordionStyles: import('tailwind-variants').TVReturnType<{
-    isOpen: {
-        true: {
-            header: string[];
-            chevron: string[];
-        };
-        false: {
-            chevron: string[];
-        };
-    };
-}, {
-    base: string[];
-    header: string[];
-    chevron: string[];
-    content: string[];
-}, undefined, {
-    isOpen: {
-        true: {
-            header: string[];
-            chevron: string[];
-        };
-        false: {
-            chevron: string[];
-        };
-    };
-}, {
-    base: string[];
-    header: string[];
-    chevron: string[];
-    content: string[];
-}, import('tailwind-variants').TVReturnType<{
-    isOpen: {
-        true: {
-            header: string[];
-            chevron: string[];
-        };
-        false: {
-            chevron: string[];
-        };
-    };
-}, {
-    base: string[];
-    header: string[];
-    chevron: string[];
-    content: string[];
-}, undefined, unknown, unknown, undefined>>;

package/dist/components/Accordion/Accordion.types.d.ts

@@ -1,33 +0,0 @@
-import { ReactNode } from 'react';
-export interface AccordionItem {
-    id: string;
-    title: string;
-    supportingText?: string;
-    children: ReactNode;
-    isOpen?: boolean;
-    disabled?: boolean;
-}
-export type AccordionItemId<T extends readonly AccordionItem[]> = T[number]['id'];
-export interface AccordionProps<T extends readonly AccordionItem[] = readonly AccordionItem[]> {
-    /**
-     * The children of the Accordion.
-     */
-    items: AccordionItem[];
-    /**
-     * The open items of the Accordion. By default, all items are closed. <br />
-     * The ids must match the `id` of the item. <br />
-     * When allowMultipleOpenItems is false, this should be a single id or undefined. <br />
-     * When allowMultipleOpenItems is true, this can be an array of ids or undefined.
-     */
-    openItems?: AccordionItemId<T> | AccordionItemId<T>[];
-    /**
-     * Callback when the accordion header is clicked <br />
-     * If provided, this will override the default behavior and you need to manage the open items yourself.
-     */
-    onToggle?: (item: AccordionItem) => void;
-    /**
-     * Whether to allow multiple open items or not.
-     * @default false
-     */
-    allowMultipleOpenItems?: boolean;
-}

package/dist/components/Accordion/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Accordion } from './Accordion';
-export type { AccordionProps, AccordionItem, AccordionItemId, } from './Accordion.types';

package/dist/components/ActionCard/ActionCard.d.ts

@@ -1,6 +0,0 @@
-import { ActionCardProps } from './ActionCard.types';
-declare const ActionCard: {
-    ({ header, children, footer, isOpen, expandable, onExpandToggle, }: ActionCardProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default ActionCard;

package/dist/components/ActionCard/ActionCard.styled.d.ts

@@ -1,29 +0,0 @@
-export declare const actionCardHeaderStyles: import('tailwind-variants').TVReturnType<{
-    clickable: {
-        true: string[];
-    };
-}, undefined, never[], {
-    clickable: {
-        true: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    clickable: {
-        true: string[];
-    };
-}, undefined, never[], unknown, unknown, undefined>>;
-export declare const actionCardChevronStyles: import('tailwind-variants').TVReturnType<{
-    open: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, string[], {
-    open: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    open: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;

package/dist/components/ActionCard/ActionCard.types.d.ts

@@ -1,32 +0,0 @@
-import { ReactNode } from 'react';
-export interface ActionCardProps {
-    /**
-     * Content rendered inside the card header area with a
-     * `surface-container-lowest` background. Wrapped in a horizontal Stack
-     * with standardised padding so the consumer only provides the inner nodes.
-     */
-    header?: ReactNode;
-    /** Card body content. */
-    children: ReactNode;
-    /**
-     * Content rendered inside the card footer area. Wrapped in a horizontal
-     * Stack with standardised padding so the consumer only provides the inner
-     * nodes (typically action buttons).
-     */
-    footer?: ReactNode;
-    /**
-     * Whether the ActionCard is expandable.
-     * @default false
-     */
-    expandable?: boolean;
-    /**
-     * Whether the ActionCard is open or closed.
-     * @default true
-     */
-    isOpen?: boolean;
-    /**
-     * Called when the header is clicked in expandable mode.
-     * Required when using `isOpen` (controlled) so the parent can update its state.
-     */
-    onExpandToggle?: () => void;
-}

package/dist/components/ActionCard/index.d.ts

@@ -1,2 +0,0 @@
-export { default as ActionCard } from './ActionCard';
-export type { ActionCardProps } from './ActionCard.types';

package/dist/components/Avatar/Avatar/Avatar.d.ts

@@ -1,3 +0,0 @@
-import { AvatarProps } from './Avatar.types';
-declare const Avatar: ({ size, type: typeProp, name, image, initialsAmount, variant, }: AvatarProps) => import("react/jsx-runtime").JSX.Element;
-export default Avatar;

package/dist/components/Avatar/Avatar/Avatar.styled.d.ts

@@ -1,53 +0,0 @@
-export declare const avatarStyles: import('tailwind-variants').TVReturnType<{
-    size: {
-        small: string[];
-        medium: string[];
-        large: string[];
-    };
-    type: {
-        initials: never[];
-        check: never[];
-        avatar: string[];
-        image: string[];
-        zvoove: string[];
-    };
-    variant: {
-        round: string[];
-        square: never[];
-    };
-}, undefined, string[], {
-    size: {
-        small: string[];
-        medium: string[];
-        large: string[];
-    };
-    type: {
-        initials: never[];
-        check: never[];
-        avatar: string[];
-        image: string[];
-        zvoove: string[];
-    };
-    variant: {
-        round: string[];
-        square: never[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        small: string[];
-        medium: string[];
-        large: string[];
-    };
-    type: {
-        initials: never[];
-        check: never[];
-        avatar: string[];
-        image: string[];
-        zvoove: string[];
-    };
-    variant: {
-        round: string[];
-        square: never[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-export declare const imageStyles: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;

package/dist/components/Avatar/Avatar/Avatar.types.d.ts

@@ -1,34 +0,0 @@
-import { ResponsiveType } from '../../../types';
-export declare const AVATAR_SIZES: {
-    readonly SMALL: "small";
-    readonly MEDIUM: "medium";
-    readonly LARGE: "large";
-};
-export type AvatarSize = (typeof AVATAR_SIZES)[keyof typeof AVATAR_SIZES];
-export interface AvatarProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The size of the avatar
-     * @default 'large'
-     */
-    size?: ResponsiveType<AvatarSize>;
-    /**
-     * The type of the avatar
-     */
-    type?: 'initials' | 'check' | 'avatar' | 'image' | 'zvoove';
-    /**
-     * The image of the avatar
-     */
-    image?: string;
-    /**
-     * The name of the avatar
-     */
-    name?: string;
-    /**
-     * The amount of initials of the avatar
-     */
-    initialsAmount?: 1 | 2;
-    /**
-     * The variant of the avatar
-     */
-    variant?: 'round' | 'square';
-}

package/dist/components/Avatar/Avatar/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Avatar } from './Avatar';
-export type { AvatarProps } from './Avatar.types';

package/dist/components/Avatar/AvatarGroup/AvatarGroup.d.ts

@@ -1,3 +0,0 @@
-import { AvatarGroupProps } from './AvatarGroup.types';
-declare const AvatarGroup: ({ children, maxLength, total }: AvatarGroupProps) => import("react/jsx-runtime").JSX.Element;
-export default AvatarGroup;

package/dist/components/Avatar/AvatarGroup/AvatarGroup.styled.d.ts

@@ -1,3 +0,0 @@
-export declare const avatarGroupStyles: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export declare const avatarContainerStyles: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export declare const avatarCounterStyles: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;

package/dist/components/Avatar/AvatarGroup/AvatarGroup.types.d.ts

@@ -1,15 +0,0 @@
-import { ReactNode } from 'react';
-export interface AvatarGroupProps {
-    /**
-     * The children of the button.
-     */
-    children: ReactNode;
-    /**
-     * Maximum number of avatars to display before showing a count
-     */
-    maxLength?: number;
-    /**
-     * Total number of avatars in the group
-     */
-    total?: number;
-}

package/dist/components/Avatar/AvatarGroup/index.d.ts

@@ -1,2 +0,0 @@
-export { default as AvatarGroup } from './AvatarGroup';
-export type { AvatarGroupProps } from './AvatarGroup.types';

package/dist/components/Avatar/index.d.ts

@@ -1,2 +0,0 @@
-export * from './AvatarGroup';
-export * from './Avatar';

package/dist/components/Badge/Badge.d.ts

@@ -1,3 +0,0 @@
-import { BadgeProps } from './Badge.types';
-declare const Badge: ({ children, variant, content, dot, }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
-export default Badge;

package/dist/components/Badge/Badge.styled.d.ts

@@ -1,28 +0,0 @@
-export declare const badgeStyles: import('tailwind-variants').TVReturnType<{
-    variant: {
-        primary: string[];
-        secondary: string[];
-    };
-    dot: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, string[], {
-    variant: {
-        primary: string[];
-        secondary: string[];
-    };
-    dot: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    variant: {
-        primary: string[];
-        secondary: string[];
-    };
-    dot: {
-        true: string[];
-        false: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;

package/dist/components/Badge/Badge.types.d.ts

@@ -1,19 +0,0 @@
-import { ReactNode } from 'react';
-export interface BadgeProps {
-    /**
-     * The children of the button.
-     */
-    children: ReactNode;
-    /**
-     * The variant of the component
-     */
-    variant?: 'primary' | 'secondary';
-    /**
-     * The content of the badge. If undefined, the badge will be hidden.
-     */
-    content?: ReactNode;
-    /**
-     * The dot prop changes a badge into a small dot
-     */
-    dot?: boolean;
-}

package/dist/components/Badge/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Badge } from './Badge';
-export type { BadgeProps } from './Badge.types';

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,4 +0,0 @@
-import { default as React } from 'react';
-import { BreadcrumbsProps } from './Breadcrumbs.types';
-declare const Breadcrumbs: <T extends React.ElementType = "a">({ items, linkComponent: LinkComponent, homeIcon, }: BreadcrumbsProps<T>) => import("react/jsx-runtime").JSX.Element;
-export default Breadcrumbs;

package/dist/components/Breadcrumbs/Breadcrumbs.styled.d.ts

@@ -1,14 +0,0 @@
-export declare const breadcrumbsStyles: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export declare const linkStyles: import('tailwind-variants').TVReturnType<{
-    hasHref: {
-        false: string[];
-    };
-}, undefined, never[], {
-    hasHref: {
-        false: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    hasHref: {
-        false: string[];
-    };
-}, undefined, never[], unknown, unknown, undefined>>;

package/dist/components/Breadcrumbs/Breadcrumbs.types.d.ts

@@ -1,22 +0,0 @@
-import { CommonIconNames } from '../../index.ts';
-export type BreadcrumbsItem<T extends React.ElementType = 'a'> = {
-    label: string;
-} & Omit<React.ComponentPropsWithoutRef<T>, 'children'>;
-export type BreadcrumbsProps<T extends React.ElementType = 'a'> = {
-    /**
-     * The items of the component. <br />
-     * The items are displayed in the order they are passed. <br />
-     * `type BreadcrumbsItem = { label: string; href: string; onItemClick?: () => void; }`
-     */
-    items: BreadcrumbsItem<T>[];
-    /**
-     * The component to render for the link
-     * @default 'a'
-     */
-    linkComponent?: T | 'a';
-    /**
-     * The icon name for the home (first) breadcrumb item
-     * @default 'home'
-     */
-    homeIcon?: CommonIconNames;
-};

package/dist/components/Breadcrumbs/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Breadcrumbs } from './Breadcrumbs';
-export type { BreadcrumbsProps, BreadcrumbsItem } from './Breadcrumbs.types';

package/dist/components/Button/Button.d.ts

@@ -1,9 +0,0 @@
-import { ForwardedRef } from 'react';
-import { ButtonProps } from './Button.types';
-declare const Button: {
-    <T extends React.ElementType = "button">({ children, variant, hideLabel, as, icon, linkComponent, size, isLoading, ...props }: ButtonProps<T> & {
-        ref?: ForwardedRef<T>;
-    }): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default Button;

package/dist/components/Button/Button.styled.d.ts

@@ -1,98 +0,0 @@
-export declare const buttonContentStyles: import('tailwind-variants').TVReturnType<{
-    isLoading: {
-        true: string[];
-    };
-}, undefined, string[], {
-    isLoading: {
-        true: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    isLoading: {
-        true: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-export declare const buttonStyles: import('tailwind-variants').TVReturnType<{
-    isLoading: {
-        true: string[];
-        false: string[];
-    };
-    size: {
-        sm: string[];
-        md: string[];
-        lg: string[];
-    };
-    hasIconOnly: {
-        false: never[];
-    };
-    hasIcon: {
-        true: never[];
-    };
-    variant: {
-        filled: string[];
-        outlined: string[];
-        text: string[];
-        textSecondary: string[];
-        elevated: string[];
-        tonal: string[];
-        linkPrimary: string[];
-        linkSecondary: string[];
-        positive: string[];
-        negative: string[];
-    };
-}, undefined, string[], {
-    isLoading: {
-        true: string[];
-        false: string[];
-    };
-    size: {
-        sm: string[];
-        md: string[];
-        lg: string[];
-    };
-    hasIconOnly: {
-        false: never[];
-    };
-    hasIcon: {
-        true: never[];
-    };
-    variant: {
-        filled: string[];
-        outlined: string[];
-        text: string[];
-        textSecondary: string[];
-        elevated: string[];
-        tonal: string[];
-        linkPrimary: string[];
-        linkSecondary: string[];
-        positive: string[];
-        negative: string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    isLoading: {
-        true: string[];
-        false: string[];
-    };
-    size: {
-        sm: string[];
-        md: string[];
-        lg: string[];
-    };
-    hasIconOnly: {
-        false: never[];
-    };
-    hasIcon: {
-        true: never[];
-    };
-    variant: {
-        filled: string[];
-        outlined: string[];
-        text: string[];
-        textSecondary: string[];
-        elevated: string[];
-        tonal: string[];
-        linkPrimary: string[];
-        linkSecondary: string[];
-        positive: string[];
-        negative: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;