@zimyo/ui 1.10.3 → 1.10.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/components/DataTable/index.esm.js +1 -1
  2. package/dist/index.esm.js +1 -1
  3. package/package.json +1 -1
package/dist/components/DataTable/index.esm.js CHANGED
@@ -20,4 +20,4 @@ function m(e,t){return"function"==typeof e?e(t):e}function f(e,t){return n=>{t.s
20
20
  *
21
21
  * @license MIT
22
22
  */
23
- function ue(e,t){return e?function(e){return"function"==typeof e&&(()=>{const t=Object.getPrototypeOf(e);return t.prototype&&t.prototype.isReactComponent})()}(n=e)||"function"==typeof n||function(e){return"object"==typeof e&&"symbol"==typeof e.$$typeof&&["react.memo","react.forward_ref"].includes(e.$$typeof.description)}(n)?o.createElement(e,t):e:null;var n}function re(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter(Boolean).join(" ")}var ae=function(e){var n=e.isExpanded,o=e.onToggle;return t("button",{type:"button",className:"zui:flex zui:items-center zui:justify-center zui:w-8 zui:h-8 zui:rounded-md zui:border zui:border-gray-200 zui:bg-white hover:zui:bg-gray-50 hover:zui:border-gray-300 zui:transition-all zui:duration-200 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 zui:group",onClick:function(e){e.stopPropagation(),o()},"aria-label":n?"Collapse row":"Expand row",children:t(g,{className:re("zui:h-4 zui:w-4 zui:text-gray-500 zui:transition-all zui:duration-300 zui:ease-in-out group-hover:zui:text-gray-700",n&&"zui:rotate-90 zui:text-blue-600 group-hover:zui:text-blue-700")})})},se=function(e){var n=e.isExpanded,o=e.children,l=e.colSpan;return t("tr",{className:re("zui:border-b zui:border-gray-200 zui:transition-all zui:duration-300 zui:ease-in-out",n?"zui:opacity-100 zui:scale-100":"zui:opacity-0 zui:scale-95 zui:h-0"),style:{display:n?"table-row":"none"},children:t("td",{className:"zui:bg-gradient-to-r zui:from-blue-50 zui:to-gray-50 zui:border-b zui:border-gray-200",colSpan:l,children:t("div",{className:re("zui:overflow-hidden zui:transition-all zui:duration-500 zui:ease-in-out",n?"zui:max-h-96 zui:opacity-100 zui:py-6 zui:px-6":"zui:max-h-0 zui:opacity-0 zui:py-0 zui:px-6"),children:t("div",{className:re("zui:transform zui:transition-all zui:duration-300 zui:ease-out",n?"zui:translate-y-0 zui:scale-100":"zui:-translate-y-2 zui:scale-95"),children:o})})})})};function ge(m){var f=m.columns,z=m.data,w=m.serverMode,v=void 0!==w&&w,S=m.pagination,C=void 0===S?{}:S,x=m.selection,y=void 0===x?{}:x,F=m.expansion,M=void 0===F?{}:F,P=m.sorting,I=void 0===P?{}:P,V=m.loading,_=void 0===V?{}:V,E=m.styling,N=void 0===E?{}:E,G=C.enabled,A=void 0===G||G,L=C.totalCount,D=C.currentPage,H=C.pageSize,O=C.pageSizeOptions,k=void 0===O?[10,25,50,100]:O,B=C.initialPageSize,T=void 0===B?10:B,j=C.onPageChange,q=C.onPageSizeChange,U=C.showInfo,$=void 0===U||U,X=C.showPageSizeSelector,K=void 0===X||X,W=C.showGoToPage,J=void 0===W||W,Q=y.enabled,Y=void 0!==Q&&Q,Z=y.rowIdAccessor,ee=y.onBulkAction,te=y.bulkActions,ne=void 0===te?[]:te,oe=y.selectionText,ge=void 0===oe?function(e){return"".concat(e," row").concat(1!==e?"s":""," selected")}:oe,de=M.enabled,ce=void 0!==de&&de,pe=M.renderExpanded,me=I.enabled,fe=void 0===me||me,ze=I.initialSorting,he=void 0===ze?[]:ze,be=I.onSort,we=_.loading,ve=void 0!==we&&we,Se=_.fetched,Ce=void 0===Se||Se,Re=_.loadingRows,xe=_.emptyMessage,ye=void 0===xe?"No data found":xe,Fe=N.className,Me=N.showColumnBorders,Pe=void 0===Me||Me,Ie=N.showRowBorders,Ve=void 0===Ie||Ie,_e=N.stickyHeader,Ee=void 0===_e||_e,Ne=N.pinLeft,Ge=void 0===Ne?0:Ne,Ae=N.pinRight,Le=void 0===Ae?0:Ae,De=l.useState(he),He=De[0],Oe=De[1],ke=l.useState({pageIndex:null!=D?D:0,pageSize:null!=H?H:T}),Be=ke[0],Te=ke[1],je=l.useState({}),qe=je[0],Ue=je[1],$e=l.useState({}),Xe=$e[0],Ke=$e[1];l.useEffect(function(){!A||"number"!=typeof D&&"number"!=typeof H||Te(function(e){return{pageIndex:null!=D?D:e.pageIndex,pageSize:null!=H?H:e.pageSize}})},[D,H,A]);var We=l.useCallback(function(e,t){return Z?Z(e):String(t)},[Z]),Je=l.useMemo(function(){var e=[];return ce&&e.push({id:"__expand__",header:function(){return null},enableSorting:!1,enableHiding:!1,size:50,cell:function(e){var n=e.row;return t("div",{className:"zui:flex zui:items-center zui:justify-center",children:t(ae,{isExpanded:n.getIsExpanded(),onToggle:function(){return n.toggleExpanded()}})})}}),Y&&e.push({id:"__select__",header:function(e){var n=e.table,o=n.getIsAllPageRowsSelected(),l=n.getIsSomePageRowsSelected();return t("div",{className:"zui:flex zui:items-center zui:justify-center",children:t(i,{size:"sm","aria-label":"Select all rows",checked:o,indeterminate:l&&!o,onChange:function(e){return n.toggleAllPageRowsSelected(e.target.checked)}})})},cell:function(e){var n=e.row;return t("div",{className:"zui:flex zui:items-center zui:justify-center",children:t(i,{size:"sm","aria-label":"Select row",checked:n.getIsSelected(),onChange:function(e){e.stopPropagation(),n.toggleSelected(e.target.checked)}})})},enableSorting:!1,enableHiding:!1,size:50}),e},[ce,Y]),Qe=function(e){const t={state:{},onStateChange:()=>{},renderFallbackValue:null,...e},[n]=o.useState(()=>({current:le(t)})),[l,i]=o.useState(()=>n.current.initialState);return n.current.setOptions(t=>({...t,...e,state:{...l,...e.state},onStateChange:t=>{i(t),null==e.onStateChange||e.onStateChange(t)}})),n.current}({data:z,columns:l.useMemo(function(){return e(e([],Je,!0),f,!0)},[Je,f]),getRowId:We,state:{sorting:fe?He:[],rowSelection:Y?qe:{},expanded:ce?Xe:{},pagination:A?Be:{pageIndex:0,pageSize:z.length||1e3}},enableSorting:fe,onSortingChange:fe?function(e){var t="function"==typeof e?e(He):e;Oe(t),be&&be(t)}:void 0,onRowSelectionChange:Y?Ue:void 0,onExpandedChange:ce?Ke:void 0,onPaginationChange:A?function(e){var t="function"==typeof e?e(Be):e;Te(t),j&&j(t.pageIndex,t.pageSize),q&&t.pageSize!==Be.pageSize&&q(t.pageSize)}:void 0,manualPagination:v&&A,manualSorting:v&&fe,pageCount:v&&A&&"number"==typeof L?Math.max(1,Math.ceil(L/Be.pageSize)):void 0,getCoreRowModel:e=>h(()=>[e.options.data],t=>{const n={rows:[],flatRows:[],rowsById:{}},o=function(t,l,i){void 0===l&&(l=0);const u=[];for(let a=0;a<t.length;a++){const s=R(e,e._getRowId(t[a],a,i),t[a],a,l,void 0,null==i?void 0:i.id);var r;n.flatRows.push(s),n.rowsById[s.id]=s,u.push(s),e.options.getSubRows&&(s.originalSubRows=e.options.getSubRows(t[a],a),null!=(r=s.originalSubRows)&&r.length&&(s.subRows=o(s.originalSubRows,l+1,s)))}return u};return n.rows=o(t),n},b(e.options,"debugTable","getRowModel",()=>e._autoResetPageIndex())),getSortedRowModel:!v&&fe?e=>h(()=>[e.getState().sorting,e.getPreSortedRowModel()],(t,n)=>{if(!n.rows.length||null==t||!t.length)return n;const o=e.getState().sorting,l=[],i=o.filter(t=>{var n;return null==(n=e.getColumn(t.id))?void 0:n.getCanSort()}),u={};i.forEach(t=>{const n=e.getColumn(t.id);n&&(u[t.id]={sortUndefined:n.columnDef.sortUndefined,invertSorting:n.columnDef.invertSorting,sortingFn:n.getSortingFn()})});const r=e=>{const t=e.map(e=>({...e}));return t.sort((e,t)=>{for(let o=0;o<i.length;o+=1){var n;const l=i[o],r=u[l.id],a=r.sortUndefined,s=null!=(n=null==l?void 0:l.desc)&&n;let g=0;if(a){const n=void 0===e.getValue(l.id),o=void 0===t.getValue(l.id);if(n||o){if("first"===a)return n?-1:1;if("last"===a)return n?1:-1;g=n&&o?0:n?a:-a}}if(0===g&&(g=r.sortingFn(e,t,l.id)),0!==g)return s&&(g*=-1),r.invertSorting&&(g*=-1),g}return e.index-t.index}),t.forEach(e=>{var t;l.push(e),null!=(t=e.subRows)&&t.length&&(e.subRows=r(e.subRows))}),t};return{rows:r(n.rows),flatRows:l,rowsById:n.rowsById}},b(e.options,"debugTable","getSortedRowModel",()=>e._autoResetPageIndex())):void 0,getPaginationRowModel:!v&&A?e=>h(()=>[e.getState().pagination,e.getPrePaginationRowModel(),e.options.paginateExpandedRows?void 0:e.getState().expanded],(t,n)=>{if(!n.rows.length)return n;const{pageSize:o,pageIndex:l}=t;let{rows:i,flatRows:u,rowsById:r}=n;const a=o*l,s=a+o;let g;i=i.slice(a,s),g=e.options.paginateExpandedRows?{rows:i,flatRows:u,rowsById:r}:ie({rows:i,flatRows:u,rowsById:r}),g.flatRows=[];const d=e=>{g.flatRows.push(e),e.subRows.length&&e.subRows.forEach(d)};return g.rows.forEach(d),g},b(e.options,"debugTable","getPaginationRowModel")):void 0,getExpandedRowModel:ce?e=>h(()=>[e.getState().expanded,e.getPreExpandedRowModel(),e.options.paginateExpandedRows],(e,t,n)=>!t.rows.length||!0!==e&&!Object.keys(null!=e?e:{}).length?t:n?ie(t):t,b(e.options,"debugTable","getExpandedRowModel")):void 0}),Ye=Qe.getVisibleLeafColumns(),Ze=l.useMemo(function(){return Qe.getSelectedRowModel().rows.map(function(e){return e.id})},[qe,Qe]),et=null!=Re?Re:A?Be.pageSize:10,tt=function(e){for(var t,n=0,o=0;o<e;o++)n+=(null===(t=Ye[o])||void 0===t?void 0:t.getSize())||150;return n},nt=function(e){for(var t,n=0,o=e+1;o<Ye.length;o++)n+=(null===(t=Ye[o])||void 0===t?void 0:t.getSize())||150;return n},ot=function(e){return Pe?e?"":"zui:border-r zui:border-gray-200":""},lt=function(){return Ve?"zui:border-b zui:border-gray-200":""},it=A?v&&"number"==typeof L?Math.max(1,Math.ceil(L/Be.pageSize)):Qe.getPageCount():1,ut=A?Be.pageIndex*Be.pageSize+1:1,rt=A?Math.min((Be.pageIndex+1)*Be.pageSize,v?L||0:z.length):z.length,at=v?L||0:z.length;return n("div",{className:re("zui:flex zui:flex-col zui:h-full zui:bg-white zui:w-full",Fe),children:[Y&&Ze.length>0&&t("div",{className:"zui:bg-blue-50 zui:px-3 zui:py-2 zui:border-blue-200 zui:flex-shrink-0 zui:my-2 zui:mx-1 zui:rounded-sm",children:n("div",{className:"zui:flex zui:items-center zui:justify-between",children:[t("span",{className:"zui:text-sm zui:text-blue-700 zui:font-medium",children:ge(Ze.length)}),n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[ne.map(function(e){return n("button",{onClick:function(){return function(e){if(ee){var t=Qe.getSelectedRowModel().rows.map(function(e){return We(e.original,Number(e.id))});ee(t,e)}}(e.key)},className:re("zui:inline-flex zui:items-center zui:px-3 zui:py-1.5 zui:text-sm zui:font-medium zui:rounded-md zui:transition-colors","destructive"===e.variant?"zui:bg-red-600 zui:text-white hover:zui:bg-red-700":"zui:bg-white zui:text-gray-700 zui:border zui:border-gray-300 hover:zui:bg-gray-50"),children:[t(e.icon,{className:"zui:h-4 zui:w-4 zui:mr-1"}),e.label]},e.key)}),t("button",{onClick:function(){Ue({})},className:"zui:text-sm zui:text-blue-600 hover:zui:text-blue-800 zui:font-medium",children:"Clear selection"})]})]})}),t("div",{className:"zui:flex-1 zui:overflow-hidden zui:relative",children:t("div",{className:"zui:h-full zui:overflow-auto",children:n("table",{className:"zui:w-full zui:text-sm zui:border-separate zui:border-spacing-0",children:[t("thead",{children:Qe.getHeaderGroups().map(function(e){return t("tr",{children:e.headers.map(function(e,o){var l=e.column.getCanSort()&&fe,i=e.column.getIsSorted(),s=o<Ge,g=o>=Ye.length-Le,d=o===Ye.length-1;return t("th",{className:re("zui:px-2 zui:py-3 zui:text-left zui:text-xs zui:font-semibold zui:text-gray-500 zui:uppercase zui:tracking-wider","zui:bg-[#e1e0e0] zui:border-b zui:border-gray-200",Ee&&"zui:sticky zui:top-0 zui:z-20",ot(d),s&&"zui:z-30 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",g&&"zui:z-30 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]",(s||g)&&"zui:sticky",l&&"zui:cursor-pointer hover:zui:bg-gray-100 zui:transition-colors zui:duration-150"),style:{left:s?"".concat(tt(o),"px"):void 0,right:g?"".concat(nt(o),"px"):void 0,minWidth:e.getSize()},onClick:l?e.column.getToggleSortingHandler():void 0,children:e.isPlaceholder?null:n("div",{className:"zui:flex zui:items-center zui:justify-between zui:gap-2",children:[t("span",{className:"zui:flex-1",children:ue(e.column.columnDef.header,e.getContext())}),l&&n("span",{className:"zui:flex zui:items-center zui:opacity-50 hover:zui:opacity-100 zui:transition-all zui:duration-200",children:["asc"===i&&t(u,{className:"zui:h-4 zui:w-4 zui:text-blue-600"}),"desc"===i&&t(r,{className:"zui:h-4 zui:w-4 zui:text-blue-600"}),!i&&t(a,{className:"zui:h-4 zui:w-4"})]})]})},e.id)})},e.id)})}),t("tbody",{className:"zui:bg-white",children:ve?Array.from({length:et}).map(function(e,n){return t("tr",{className:re(lt()),children:Ye.map(function(e,o){var l=o<Ge,i=o>=Ye.length-Le,u=o===Ye.length-1;return t("td",{className:re("zui:px-4 zui:py-3 zui:bg-white",ot(u),l&&"zui:sticky zui:z-10 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",i&&"zui:sticky zui:z-10 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]"),style:{left:l?"".concat(tt(o),"px"):void 0,right:i?"".concat(nt(o),"px"):void 0},children:t("div",{className:"zui:h-4 zui:bg-gray-200 zui:rounded zui:animate-pulse"})},"skeleton-".concat(n,"-").concat(o))})},"skeleton-".concat(n))}):0===Qe.getRowModel().rows.length?ve||!Ce?null:t("tr",{className:re(lt()),children:t("td",{className:"zui:py-16 zui:text-center zui:text-gray-500",colSpan:Ye.length,children:n("div",{className:"zui:flex zui:flex-col zui:items-center zui:gap-3",children:[t(p,{className:"zui:h-12 zui:w-12 zui:text-gray-300"}),n("div",{children:[t("p",{className:"zui:text-lg zui:font-medium zui:text-gray-900 zui:mb-1",children:"No data found"}),t("p",{className:"zui:text-sm zui:text-gray-500",children:ye})]})]})})}):Qe.getRowModel().rows.map(function(e){return n(l.Fragment,{children:[t("tr",{className:re(lt(),"hover:zui:bg-gray-50 zui:transition-colors zui:duration-150",e.getIsSelected()&&"zui:bg-blue-50 hover:zui:bg-blue-100"),"data-row-id":e.id,children:e.getVisibleCells().map(function(n,o){var l=o<Ge,i=o>=e.getVisibleCells().length-Le,u=o===e.getVisibleCells().length-1;return t("td",{className:re("zui:px-3 zui:py-2 zui:text-sm zui:align-middle zui:transition-colors zui:duration-150",e.getIsSelected()?"zui:bg-blue-50":"zui:bg-white",ot(u),l&&"zui:sticky zui:z-10 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",i&&"zui:sticky zui:z-10 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]"),style:{left:l?"".concat(tt(o),"px"):void 0,right:i?"".concat(nt(o),"px"):void 0,minWidth:n.column.getSize()},children:ue(n.column.columnDef.cell,n.getContext())},n.id)})}),pe&&t(se,{isExpanded:e.getIsExpanded(),colSpan:e.getVisibleCells().length,children:pe(e.original)})]},e.id)})})]})})}),A&&t("div",{className:"zui:flex-shrink-0 zui:bg-white zui:px-3 zui:py-3 zui:border-t zui:border-gray-200",children:n("div",{className:"zui:flex zui:flex-row zui:items-center zui:justify-between zui:gap-2",children:[n("div",{className:"zui:flex zui:flex-row zui:items-center zui:gap-3",children:[$&&n("div",{className:"zui:text-sm zui:text-gray-700",children:["Showing ",t("span",{className:"zui:font-semibold",children:ut})," to"," ",t("span",{className:"zui:font-semibold",children:rt})," of"," ",t("span",{className:"zui:font-semibold",children:at})," results"]}),K&&n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[t("label",{className:"zui:text-sm zui:font-medium zui:text-gray-700",children:"Rows:"}),t("select",{className:"zui:px-2 zui:py-1 zui:text-sm zui:border zui:border-gray-300 zui:rounded-sm zui:bg-white zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:border-blue-500",value:Be.pageSize,onChange:function(e){return Qe.setPageSize(Number(e.target.value))},children:k.map(function(e){return t("option",{value:e,children:e},e)})})]})]}),n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[n("div",{className:"zui:flex zui:items-center zui:gap-1 sm:zui:hidden",children:[t("button",{className:"zui:inline-flex zui:items-center zui:px-1.5 zui:py-1.5 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-sm zui:shadow-xs hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.previousPage()},disabled:!Qe.getCanPreviousPage(),"aria-label":"Go to previous page",children:t(s,{className:"zui:h-4 zui:w-4"})}),n("span",{className:"zui:px-4 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700",children:[Be.pageIndex+1," of ",it]}),t("button",{className:"zui:inline-flex zui:items-center zui:px-1.5 zui:py-1.5 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-sm zui:shadow-xs hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.nextPage()},disabled:!Qe.getCanNextPage(),"aria-label":"Go to next page",children:t(g,{className:"zui:h-4 zui:w-4"})})]}),n("div",{className:"zui:hidden sm:zui:flex zui:items-center zui:gap-1",children:[t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-l-md zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.setPageIndex(0)},disabled:!Qe.getCanPreviousPage(),"aria-label":"Go to first page",children:t(d,{className:"zui:h-4 zui:w-4"})}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.previousPage()},disabled:!Qe.getCanPreviousPage(),"aria-label":"Go to previous page",children:t(s,{className:"zui:h-4 zui:w-4"})}),n("span",{className:"zui:inline-flex zui:items-center zui:px-4 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-900 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm",children:["Page ",Be.pageIndex+1," of ",it]}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.nextPage()},disabled:!Qe.getCanNextPage(),"aria-label":"Go to next page",children:t(g,{className:"zui:h-4 zui:w-4"})}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:rounded-r-md zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return Qe.setPageIndex(it-1)},disabled:!Qe.getCanNextPage(),"aria-label":"Go to last page",children:t(c,{className:"zui:h-4 zui:w-4"})}),J&&n("div",{className:"zui:flex zui:items-center zui:gap-2 zui:ml-4",children:[t("label",{className:"zui:text-sm zui:font-medium zui:text-gray-700",children:"Go to:"}),t("input",{type:"number",min:1,max:it,className:"zui:w-20 zui:px-3 zui:py-2 zui:text-sm zui:border zui:border-gray-300 zui:rounded-md zui:shadow-sm focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:border-blue-500 zui:transition-all zui:duration-200",value:Be.pageIndex+1,onChange:function(e){var t=e.target.value?Number(e.target.value)-1:0;Qe.setPageIndex(Math.max(0,Math.min(t,it-1)))}})]})]})]})]})})]})}export{ge as DataTable,ge as default};
23
+ function ue(e,t){return e?function(e){return"function"==typeof e&&(()=>{const t=Object.getPrototypeOf(e);return t.prototype&&t.prototype.isReactComponent})()}(n=e)||"function"==typeof n||function(e){return"object"==typeof e&&"symbol"==typeof e.$$typeof&&["react.memo","react.forward_ref"].includes(e.$$typeof.description)}(n)?o.createElement(e,t):e:null;var n}function re(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter(Boolean).join(" ")}var ae=function(e){var n=e.isExpanded,o=e.onToggle;return t("button",{type:"button",className:"zui:flex zui:items-center zui:justify-center zui:w-8 zui:h-8 zui:rounded-md zui:border zui:border-gray-200 zui:bg-white hover:zui:bg-gray-50 hover:zui:border-gray-300 zui:transition-all zui:duration-200 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 zui:group",onClick:function(e){e.stopPropagation(),o()},"aria-label":n?"Collapse row":"Expand row",children:t(g,{className:re("zui:h-4 zui:w-4 zui:text-gray-500 zui:transition-all zui:duration-300 zui:ease-in-out group-hover:zui:text-gray-700",n&&"zui:rotate-90 zui:text-blue-600 group-hover:zui:text-blue-700")})})},se=function(e){var n=e.isExpanded,o=e.children,l=e.colSpan;return t("tr",{className:re("zui:border-b zui:border-gray-200 zui:transition-all zui:duration-300 zui:ease-in-out",n?"zui:opacity-100 zui:scale-100":"zui:opacity-0 zui:scale-95 zui:h-0"),style:{display:n?"table-row":"none"},children:t("td",{className:"zui:bg-gradient-to-r zui:from-blue-50 zui:to-gray-50",colSpan:l,children:t("div",{className:re("zui:overflow-hidden zui:transition-all zui:duration-500 zui:ease-in-out",n?"zui:max-h-96 zui:opacity-100 zui:py-6 zui:px-6":"zui:max-h-0 zui:opacity-0 zui:py-0 zui:px-6"),children:t("div",{className:re("zui:transform zui:transition-all zui:duration-300 zui:ease-out",n?"zui:translate-y-0 zui:scale-100":"zui:-translate-y-2 zui:scale-95"),children:o})})})})};function ge(m){var f=m.columns,z=m.data,w=m.serverMode,v=void 0!==w&&w,S=m.pagination,C=void 0===S?{}:S,x=m.selection,y=void 0===x?{}:x,F=m.expansion,M=void 0===F?{}:F,P=m.sorting,I=void 0===P?{}:P,V=m.loading,_=void 0===V?{}:V,E=m.styling,N=void 0===E?{}:E,G=C.enabled,A=void 0===G||G,L=C.totalCount,D=C.currentPage,H=C.pageSize,O=C.pageSizeOptions,k=void 0===O?[10,25,50,100]:O,B=C.initialPageSize,T=void 0===B?10:B,j=C.onPageChange,q=C.onPageSizeChange,U=C.showInfo,$=void 0===U||U,X=C.showPageSizeSelector,K=void 0===X||X,W=C.showGoToPage,J=void 0===W||W,Q=y.enabled,Y=void 0!==Q&&Q,Z=y.rowIdAccessor,ee=y.onBulkAction,te=y.bulkActions,ne=void 0===te?[]:te,oe=y.selectionText,ge=void 0===oe?function(e){return"".concat(e," row").concat(1!==e?"s":""," selected")}:oe,de=M.enabled,ce=void 0!==de&&de,pe=M.renderExpanded,me=I.enabled,fe=void 0===me||me,ze=I.initialSorting,he=void 0===ze?[]:ze,be=I.onSort,we=_.loading,ve=void 0!==we&&we,Se=_.fetched,Ce=void 0===Se||Se,Re=_.loadingRows,xe=_.emptyMessage,ye=void 0===xe?"No data found":xe,Fe=N.className,Me=N.showColumnBorders,Pe=void 0===Me||Me;N.showRowBorders;var Ie=N.stickyHeader,Ve=void 0===Ie||Ie,_e=N.pinLeft,Ee=void 0===_e?0:_e,Ne=N.pinRight,Ge=void 0===Ne?0:Ne,Ae=l.useState(he),Le=Ae[0],De=Ae[1],He=l.useState({pageIndex:null!=D?D:0,pageSize:null!=H?H:T}),Oe=He[0],ke=He[1],Be=l.useState({}),Te=Be[0],je=Be[1],qe=l.useState({}),Ue=qe[0],$e=qe[1];l.useEffect(function(){!A||"number"!=typeof D&&"number"!=typeof H||ke(function(e){return{pageIndex:null!=D?D:e.pageIndex,pageSize:null!=H?H:e.pageSize}})},[D,H,A]);var Xe=l.useCallback(function(e,t){return Z?Z(e):String(t)},[Z]),Ke=l.useMemo(function(){var e=[];return ce&&e.push({id:"__expand__",header:function(){return null},enableSorting:!1,enableHiding:!1,size:50,cell:function(e){var n=e.row;return t("div",{className:"zui:flex zui:items-center zui:justify-center",children:t(ae,{isExpanded:n.getIsExpanded(),onToggle:function(){return n.toggleExpanded()}})})}}),Y&&e.push({id:"__select__",header:function(e){var n=e.table,o=n.getIsAllPageRowsSelected(),l=n.getIsSomePageRowsSelected();return t("div",{className:"zui:flex zui:items-center zui:justify-center zui:w-14",children:t(i,{"aria-label":"Select all rows",checked:o,indeterminate:l&&!o,onChange:function(e){return n.toggleAllPageRowsSelected(e.target.checked)}})})},cell:function(e){var n=e.row;return t("div",{className:"zui:flex zui:items-center zui:justify-center zui:w-12",children:t(i,{"aria-label":"Select row",checked:n.getIsSelected(),onChange:function(e){e.stopPropagation(),n.toggleSelected(e.target.checked)}})})},enableSorting:!1,enableHiding:!1,size:50}),e},[ce,Y]),We=function(e){const t={state:{},onStateChange:()=>{},renderFallbackValue:null,...e},[n]=o.useState(()=>({current:le(t)})),[l,i]=o.useState(()=>n.current.initialState);return n.current.setOptions(t=>({...t,...e,state:{...l,...e.state},onStateChange:t=>{i(t),null==e.onStateChange||e.onStateChange(t)}})),n.current}({data:z,columns:l.useMemo(function(){return e(e([],Ke,!0),f,!0)},[Ke,f]),getRowId:Xe,state:{sorting:fe?Le:[],rowSelection:Y?Te:{},expanded:ce?Ue:{},pagination:A?Oe:{pageIndex:0,pageSize:z.length||1e3}},enableSorting:fe,onSortingChange:fe?function(e){var t="function"==typeof e?e(Le):e;De(t),be&&be(t)}:void 0,onRowSelectionChange:Y?je:void 0,onExpandedChange:ce?$e:void 0,onPaginationChange:A?function(e){var t="function"==typeof e?e(Oe):e;ke(t),j&&j(t.pageIndex,t.pageSize),q&&t.pageSize!==Oe.pageSize&&q(t.pageSize)}:void 0,manualPagination:v&&A,manualSorting:v&&fe,pageCount:v&&A&&"number"==typeof L?Math.max(1,Math.ceil(L/Oe.pageSize)):void 0,getCoreRowModel:e=>h(()=>[e.options.data],t=>{const n={rows:[],flatRows:[],rowsById:{}},o=function(t,l,i){void 0===l&&(l=0);const u=[];for(let a=0;a<t.length;a++){const s=R(e,e._getRowId(t[a],a,i),t[a],a,l,void 0,null==i?void 0:i.id);var r;n.flatRows.push(s),n.rowsById[s.id]=s,u.push(s),e.options.getSubRows&&(s.originalSubRows=e.options.getSubRows(t[a],a),null!=(r=s.originalSubRows)&&r.length&&(s.subRows=o(s.originalSubRows,l+1,s)))}return u};return n.rows=o(t),n},b(e.options,"debugTable","getRowModel",()=>e._autoResetPageIndex())),getSortedRowModel:!v&&fe?e=>h(()=>[e.getState().sorting,e.getPreSortedRowModel()],(t,n)=>{if(!n.rows.length||null==t||!t.length)return n;const o=e.getState().sorting,l=[],i=o.filter(t=>{var n;return null==(n=e.getColumn(t.id))?void 0:n.getCanSort()}),u={};i.forEach(t=>{const n=e.getColumn(t.id);n&&(u[t.id]={sortUndefined:n.columnDef.sortUndefined,invertSorting:n.columnDef.invertSorting,sortingFn:n.getSortingFn()})});const r=e=>{const t=e.map(e=>({...e}));return t.sort((e,t)=>{for(let o=0;o<i.length;o+=1){var n;const l=i[o],r=u[l.id],a=r.sortUndefined,s=null!=(n=null==l?void 0:l.desc)&&n;let g=0;if(a){const n=void 0===e.getValue(l.id),o=void 0===t.getValue(l.id);if(n||o){if("first"===a)return n?-1:1;if("last"===a)return n?1:-1;g=n&&o?0:n?a:-a}}if(0===g&&(g=r.sortingFn(e,t,l.id)),0!==g)return s&&(g*=-1),r.invertSorting&&(g*=-1),g}return e.index-t.index}),t.forEach(e=>{var t;l.push(e),null!=(t=e.subRows)&&t.length&&(e.subRows=r(e.subRows))}),t};return{rows:r(n.rows),flatRows:l,rowsById:n.rowsById}},b(e.options,"debugTable","getSortedRowModel",()=>e._autoResetPageIndex())):void 0,getPaginationRowModel:!v&&A?e=>h(()=>[e.getState().pagination,e.getPrePaginationRowModel(),e.options.paginateExpandedRows?void 0:e.getState().expanded],(t,n)=>{if(!n.rows.length)return n;const{pageSize:o,pageIndex:l}=t;let{rows:i,flatRows:u,rowsById:r}=n;const a=o*l,s=a+o;let g;i=i.slice(a,s),g=e.options.paginateExpandedRows?{rows:i,flatRows:u,rowsById:r}:ie({rows:i,flatRows:u,rowsById:r}),g.flatRows=[];const d=e=>{g.flatRows.push(e),e.subRows.length&&e.subRows.forEach(d)};return g.rows.forEach(d),g},b(e.options,"debugTable","getPaginationRowModel")):void 0,getExpandedRowModel:ce?e=>h(()=>[e.getState().expanded,e.getPreExpandedRowModel(),e.options.paginateExpandedRows],(e,t,n)=>!t.rows.length||!0!==e&&!Object.keys(null!=e?e:{}).length?t:n?ie(t):t,b(e.options,"debugTable","getExpandedRowModel")):void 0}),Je=We.getVisibleLeafColumns(),Qe=l.useMemo(function(){return We.getSelectedRowModel().rows.map(function(e){return e.id})},[Te,We]),Ye=null!=Re?Re:A?Oe.pageSize:10,Ze=function(e){for(var t,n=0,o=0;o<e;o++)n+=(null===(t=Je[o])||void 0===t?void 0:t.getSize())||150;return n},et=function(e){for(var t,n=0,o=e+1;o<Je.length;o++)n+=(null===(t=Je[o])||void 0===t?void 0:t.getSize())||150;return n},tt=function(e){return Pe?e?"":"zui:border-r zui:border-gray-200":""},nt=A?v&&"number"==typeof L?Math.max(1,Math.ceil(L/Oe.pageSize)):We.getPageCount():1,ot=A?Oe.pageIndex*Oe.pageSize+1:1,lt=A?Math.min((Oe.pageIndex+1)*Oe.pageSize,v?L||0:z.length):z.length,it=v?L||0:z.length;return n("div",{className:re("zui:flex zui:flex-col zui:h-full zui:bg-white zui:w-full",Fe),children:[Y&&Qe.length>0&&t("div",{className:"zui:bg-blue-50 zui:px-3 zui:py-2 zui:border-blue-200 zui:flex-shrink-0 zui:my-2 zui:mx-1 zui:rounded-sm",children:n("div",{className:"zui:flex zui:items-center zui:justify-between",children:[t("span",{className:"zui:text-sm zui:text-blue-700 zui:font-medium",children:ge(Qe.length)}),n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[ne.map(function(e){return n("button",{onClick:function(){return function(e){if(ee){var t=We.getSelectedRowModel().rows.map(function(e){return Xe(e.original,Number(e.id))});ee(t,e)}}(e.key)},className:re("zui:inline-flex zui:items-center zui:px-3 zui:py-1.5 zui:text-sm zui:font-medium zui:rounded-md zui:transition-colors","destructive"===e.variant?"zui:bg-red-600 zui:text-white hover:zui:bg-red-700":"zui:bg-white zui:text-gray-700 zui:border zui:border-gray-300 hover:zui:bg-gray-50"),children:[t(e.icon,{className:"zui:h-4 zui:w-4 zui:mr-1"}),e.label]},e.key)}),t("button",{onClick:function(){je({})},className:"zui:text-sm zui:text-blue-600 hover:zui:text-blue-800 zui:font-medium",children:"Clear selection"})]})]})}),t("div",{className:"zui:flex-1 zui:overflow-hidden zui:relative",children:t("div",{className:"zui:h-full zui:overflow-auto",children:n("table",{className:"zui:w-full zui:text-sm zui:border-separate zui:border-spacing-0",children:[t("thead",{children:We.getHeaderGroups().map(function(e){return t("tr",{children:e.headers.map(function(e,o){var l=e.column.getCanSort()&&fe,i=e.column.getIsSorted(),s=o<Ee,g=o>=Je.length-Ge,d=o===Je.length-1;return t("th",{className:re("zui:px-2 zui:py-3 zui:text-left zui:text-xs zui:font-semibold zui:text-gray-500 zui:uppercase zui:tracking-wider","zui:bg-gray-200 zui:border-b zui:border-gray-300",Ve&&"zui:sticky zui:top-0 zui:z-20",tt(d),s&&"zui:z-30 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",g&&"zui:z-30 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]",(s||g)&&"zui:sticky",l&&"zui:cursor-pointer hover:zui:bg-gray-100 zui:transition-colors zui:duration-150"),style:{left:s?"".concat(Ze(o),"px"):void 0,right:g?"".concat(et(o),"px"):void 0,minWidth:e.getSize()},onClick:l?e.column.getToggleSortingHandler():void 0,children:e.isPlaceholder?null:n("div",{className:"zui:flex zui:items-center zui:justify-between zui:gap-2",children:[t("span",{className:"zui:flex-1",children:ue(e.column.columnDef.header,e.getContext())}),l&&n("span",{className:"zui:flex zui:items-center zui:opacity-50 hover:zui:opacity-100 zui:transition-all zui:duration-200",children:["asc"===i&&t(u,{className:"zui:h-4 zui:w-4 zui:text-blue-600"}),"desc"===i&&t(r,{className:"zui:h-4 zui:w-4 zui:text-blue-600"}),!i&&t(a,{className:"zui:h-4 zui:w-4"})]})]})},e.id)})},e.id)})}),t("tbody",{className:"zui:bg-white",children:ve?Array.from({length:Ye}).map(function(e,n){return t("tr",{className:re("zui:border-b zui:border-gray-200"),children:Je.map(function(e,o){var l=o<Ee,i=o>=Je.length-Ge,u=o===Je.length-1;return t("td",{className:re("zui:px-3 zui:py-2 zui:bg-white",tt(u),l&&"zui:sticky zui:z-10 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",i&&"zui:sticky zui:z-10 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]"),style:{left:l?"".concat(Ze(o),"px"):void 0,right:i?"".concat(et(o),"px"):void 0},children:t("div",{className:"zui:h-4 zui:bg-gray-200 zui:rounded zui:animate-pulse"})},"skeleton-".concat(n,"-").concat(o))})},"skeleton-".concat(n))}):0===We.getRowModel().rows.length?ve||!Ce?null:t("tr",{className:re("zui:border-b zui:border-gray-200"),children:t("td",{className:"zui:py-16 zui:text-center zui:text-gray-500",colSpan:Je.length,children:n("div",{className:"zui:flex zui:flex-col zui:items-center zui:gap-3",children:[t(p,{className:"zui:h-12 zui:w-12 zui:text-gray-300"}),n("div",{children:[t("p",{className:"zui:text-lg zui:font-medium zui:text-gray-900 zui:mb-1",children:"No data found"}),t("p",{className:"zui:text-sm zui:text-gray-500",children:ye})]})]})})}):We.getRowModel().rows.map(function(e){return n(l.Fragment,{children:[t("tr",{className:re("zui:border-b zui:border-gray-700","hover:zui:bg-gray-50 zui:transition-colors zui:duration-150",e.getIsSelected()&&"zui:bg-blue-50 hover:zui:bg-blue-100"),"data-row-id":e.id,children:e.getVisibleCells().map(function(n,o){var l=o<Ee,i=o>=e.getVisibleCells().length-Ge,u=o===e.getVisibleCells().length-1;return t("td",{className:re("zui:px-3 zui:py-2 zui:text-sm zui:align-middle zui:transition-colors zui:duration-150",e.getIsSelected()?"zui:bg-blue-50":"zui:bg-white",tt(u),l&&"zui:sticky zui:z-10 zui:shadow-[2px_0_5px_-2px_rgba(0,0,0,0.1)]",i&&"zui:sticky zui:z-10 zui:shadow-[-2px_0_5px_-2px_rgba(0,0,0,0.1)]"),style:{left:l?"".concat(Ze(o),"px"):void 0,right:i?"".concat(et(o),"px"):void 0,minWidth:n.column.getSize()},children:ue(n.column.columnDef.cell,n.getContext())},n.id)})}),pe&&t(se,{isExpanded:e.getIsExpanded(),colSpan:e.getVisibleCells().length,children:pe(e.original)})]},e.id)})})]})})}),A&&t("div",{className:"zui:flex-shrink-0 zui:bg-white zui:px-3 zui:py-3 zui:border-t zui:border-gray-200",children:n("div",{className:"zui:flex zui:flex-row zui:items-center zui:justify-between zui:gap-2",children:[n("div",{className:"zui:flex zui:flex-row zui:items-center zui:gap-3",children:[$&&n("div",{className:"zui:text-sm zui:text-gray-700",children:["Showing ",t("span",{className:"zui:font-semibold",children:ot})," to"," ",t("span",{className:"zui:font-semibold",children:lt})," of"," ",t("span",{className:"zui:font-semibold",children:it})," results"]}),K&&n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[t("label",{className:"zui:text-sm zui:font-medium zui:text-gray-700",children:"Rows:"}),t("select",{className:"zui:px-2 zui:py-1 zui:text-sm zui:border zui:border-gray-300 zui:rounded-sm zui:bg-white zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:border-blue-500",value:Oe.pageSize,onChange:function(e){return We.setPageSize(Number(e.target.value))},children:k.map(function(e){return t("option",{value:e,children:e},e)})})]})]}),n("div",{className:"zui:flex zui:items-center zui:gap-2",children:[n("div",{className:"zui:flex zui:items-center zui:gap-1 sm:zui:hidden",children:[t("button",{className:"zui:inline-flex zui:items-center zui:px-1.5 zui:py-1.5 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-sm zui:shadow-xs hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.previousPage()},disabled:!We.getCanPreviousPage(),"aria-label":"Go to previous page",children:t(s,{className:"zui:h-4 zui:w-4"})}),n("span",{className:"zui:px-4 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700",children:[Oe.pageIndex+1," of ",nt]}),t("button",{className:"zui:inline-flex zui:items-center zui:px-1.5 zui:py-1.5 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-sm zui:shadow-xs hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:ring-offset-1 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.nextPage()},disabled:!We.getCanNextPage(),"aria-label":"Go to next page",children:t(g,{className:"zui:h-4 zui:w-4"})})]}),n("div",{className:"zui:hidden sm:zui:flex zui:items-center zui:gap-1",children:[t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-gray-300 zui:rounded-l-md zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.setPageIndex(0)},disabled:!We.getCanPreviousPage(),"aria-label":"Go to first page",children:t(d,{className:"zui:h-4 zui:w-4"})}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.previousPage()},disabled:!We.getCanPreviousPage(),"aria-label":"Go to previous page",children:t(s,{className:"zui:h-4 zui:w-4"})}),n("span",{className:"zui:inline-flex zui:items-center zui:px-4 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-900 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm",children:["Page ",Oe.pageIndex+1," of ",nt]}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.nextPage()},disabled:!We.getCanNextPage(),"aria-label":"Go to next page",children:t(g,{className:"zui:h-4 zui:w-4"})}),t("button",{className:"zui:inline-flex zui:items-center zui:px-3 zui:py-2 zui:text-sm zui:font-medium zui:text-gray-700 zui:bg-white zui:border zui:border-l-0 zui:border-gray-300 zui:rounded-r-md zui:shadow-sm hover:zui:bg-gray-50 focus:zui:outline-none focus:zui:ring-1 focus:zui:ring-blue-500 focus:zui:border-blue-500 disabled:zui:opacity-50 disabled:zui:cursor-not-allowed zui:transition-all zui:duration-200",onClick:function(){return We.setPageIndex(nt-1)},disabled:!We.getCanNextPage(),"aria-label":"Go to last page",children:t(c,{className:"zui:h-4 zui:w-4"})}),J&&n("div",{className:"zui:flex zui:items-center zui:gap-2 zui:ml-4",children:[t("label",{className:"zui:text-sm zui:font-medium zui:text-gray-700",children:"Go to:"}),t("input",{type:"number",min:1,max:nt,className:"zui:w-20 zui:px-3 zui:py-2 zui:text-sm zui:border zui:border-gray-300 zui:rounded-md zui:shadow-sm focus:zui:outline-none focus:zui:ring-2 focus:zui:ring-blue-500 focus:zui:border-blue-500 zui:transition-all zui:duration-200",value:Oe.pageIndex+1,onChange:function(e){var t=e.target.value?Number(e.target.value)-1:0;We.setPageIndex(Math.max(0,Math.min(t,nt-1)))}})]})]})]})]})})]})}export{ge as DataTable,ge as default};
package/dist/index.esm.js CHANGED
@@ -1 +1 @@
1
- import{s as n}from"./chunks/index-5b35e7d9.esm.js";export{U as UILibraryThemeProvider,c as createCustomTheme,d as designTokens,t as theme}from"./chunks/index-5b35e7d9.esm.js";export{Button}from"./components/Button/index.esm.js";export{Popover}from"./components/Popover/index.esm.js";export{CardActions,CardContent,CardHeader,CardImage,CardRoot,CardSkeleton}from"./components/Card/index.esm.js";export{Select}from"./components/Select/index.esm.js";export{Accordion,AccordionContent,AccordionItem,AccordionTrigger}from"./components/Accordion/index.esm.js";export{default as Switch}from"./components/Switch/index.esm.js";export{RadioGroup}from"./components/RadioGroup/index.esm.js";export{H as Heading}from"./chunks/Heading-b91e2c5f.esm.js";import{T as i}from"./chunks/Text-f18219bd.esm.js";export{Blockquote,Caption,Code,Lead,Strong}from"./components/Typography/index.esm.js";export{M as Muted}from"./chunks/Muted-bfc4985b.esm.js";export{Modal}from"./components/Modal/index.esm.js";import{jsxs as r,jsx as o}from"react/jsx-runtime";import{Drawer as a,Box as e,IconButton as l}from"@mui/material";import{c as p}from"./chunks/index-c6541658.esm.js";export{u as useStableId}from"./chunks/index-c6541658.esm.js";import"./chunks/tslib.es6-49e5b83c.esm.js";import{X as s}from"./chunks/lucide-8c9441ea.esm.js";export{Badge}from"./components/Badge/index.esm.js";export{Input}from"./components/Input/index.esm.js";export{Notice}from"./components/Notice/index.esm.js";export{DatePicker}from"./components/DatePicker/index.esm.js";export{DateRangePicker}from"./components/DateRangePicker/index.esm.js";export{Form}from"./components/Form/index.esm.js";export{Checkbox}from"./components/Checkbox/index.esm.js";export{CheckboxGroup}from"./components/CheckboxGroup/index.esm.js";export{Radio}from"./components/Radio/index.esm.js";export{PopupConfirm}from"./components/PopupConfirm/index.esm.js";export{GlobalMenuSearch}from"./components/GlobalMenuSearch/index.esm.js";export{AppList}from"./components/AppList/index.esm.js";export{Table}from"./components/Table/index.esm.js";export{BulkActionsBar}from"./components/BulkActionsBar/index.esm.js";export{TimePicker}from"./components/TimePicker/index.esm.js";export{DataTable}from"./components/DataTable/index.esm.js";import"@mui/material/styles";import"react";import"@mui/material/CardContent";import"@mui/material/CardMedia";import"./chunks/typeof-cc63ab7d.esm.js";import"./chunks/assertThisInitialized-406be690.esm.js";import"@emotion/react";import"react-dom";import"./chunks/Calender-a4ec1295.esm.js";import"@mui/material/IconButton";import"@mui/material/List";import"@mui/material/ListItemText";import"@mui/material/ListItemIcon";import"@mui/material/Popover";n('/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --zui-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",\n "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n --zui-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",\n "Courier New", monospace;\n --zui-color-red-50: oklch(97.1% 0.013 17.38);\n --zui-color-red-100: oklch(93.6% 0.032 17.717);\n --zui-color-red-200: oklch(88.5% 0.062 18.334);\n --zui-color-red-500: oklch(63.7% 0.237 25.331);\n --zui-color-red-600: oklch(57.7% 0.245 27.325);\n --zui-color-red-700: oklch(50.5% 0.213 27.518);\n --zui-color-red-800: oklch(44.4% 0.177 26.899);\n --zui-color-red-900: oklch(39.6% 0.141 25.723);\n --zui-color-orange-100: oklch(95.4% 0.038 75.164);\n --zui-color-orange-200: oklch(90.1% 0.076 70.697);\n --zui-color-orange-800: oklch(47% 0.157 37.304);\n --zui-color-amber-50: oklch(98.7% 0.022 95.277);\n --zui-color-amber-100: oklch(96.2% 0.059 95.617);\n --zui-color-amber-500: oklch(76.9% 0.188 70.08);\n --zui-color-amber-600: oklch(66.6% 0.179 58.318);\n --zui-color-amber-700: oklch(55.5% 0.163 48.998);\n --zui-color-yellow-50: oklch(98.7% 0.026 102.212);\n --zui-color-yellow-100: oklch(97.3% 0.071 103.193);\n --zui-color-yellow-200: oklch(94.5% 0.129 101.54);\n --zui-color-yellow-400: oklch(85.2% 0.199 91.936);\n --zui-color-yellow-600: oklch(68.1% 0.162 75.834);\n --zui-color-yellow-700: oklch(55.4% 0.135 66.442);\n --zui-color-yellow-800: oklch(47.6% 0.114 61.907);\n --zui-color-yellow-900: oklch(42.1% 0.095 57.708);\n --zui-color-green-50: oklch(98.2% 0.018 155.826);\n --zui-color-green-100: oklch(96.2% 0.044 156.743);\n --zui-color-green-200: oklch(92.5% 0.084 155.995);\n --zui-color-green-500: oklch(72.3% 0.219 149.579);\n --zui-color-green-600: oklch(62.7% 0.194 149.214);\n --zui-color-green-700: oklch(52.7% 0.154 150.069);\n --zui-color-green-800: oklch(44.8% 0.119 151.328);\n --zui-color-green-900: oklch(39.3% 0.095 152.535);\n --zui-color-blue-50: oklch(97% 0.014 254.604);\n --zui-color-blue-100: oklch(93.2% 0.032 255.585);\n --zui-color-blue-200: oklch(88.2% 0.059 254.128);\n --zui-color-blue-500: oklch(62.3% 0.214 259.815);\n --zui-color-blue-600: oklch(54.6% 0.245 262.881);\n --zui-color-blue-700: oklch(48.8% 0.243 264.376);\n --zui-color-blue-800: oklch(42.4% 0.199 265.638);\n --zui-color-blue-900: oklch(37.9% 0.146 265.522);\n --zui-color-purple-100: oklch(94.6% 0.033 307.174);\n --zui-color-purple-200: oklch(90.2% 0.063 306.703);\n --zui-color-purple-500: oklch(62.7% 0.265 303.9);\n --zui-color-purple-600: oklch(55.8% 0.288 302.321);\n --zui-color-purple-800: oklch(43.8% 0.218 303.724);\n --zui-color-slate-200: oklch(92.9% 0.013 255.508);\n --zui-color-slate-300: oklch(86.9% 0.022 252.894);\n --zui-color-slate-500: oklch(55.4% 0.046 257.417);\n --zui-color-slate-800: oklch(27.9% 0.041 260.031);\n --zui-color-gray-50: oklch(98.5% 0.002 247.839);\n --zui-color-gray-100: oklch(96.7% 0.003 264.542);\n --zui-color-gray-200: oklch(92.8% 0.006 264.531);\n --zui-color-gray-300: oklch(87.2% 0.01 258.338);\n --zui-color-gray-400: oklch(70.7% 0.022 261.325);\n --zui-color-gray-500: oklch(55.1% 0.027 264.364);\n --zui-color-gray-600: oklch(44.6% 0.03 256.802);\n --zui-color-gray-700: oklch(37.3% 0.034 259.733);\n --zui-color-gray-800: oklch(27.8% 0.033 256.848);\n --zui-color-gray-900: oklch(21% 0.034 264.665);\n --zui-color-neutral-100: oklch(97% 0 0);\n --zui-color-neutral-400: oklch(70.8% 0 0);\n --zui-color-white: #fff;\n --zui-spacing: 0.25rem;\n --zui-container-sm: 24rem;\n --zui-container-md: 28rem;\n --zui-container-2xl: 42rem;\n --zui-container-4xl: 56rem;\n --zui-text-xs: 0.75rem;\n --zui-text-xs--line-height: calc(1 / 0.75);\n --zui-text-sm: 0.875rem;\n --zui-text-sm--line-height: calc(1.25 / 0.875);\n --zui-text-base: 1rem;\n --zui-text-base--line-height: calc(1.5 / 1);\n --zui-text-lg: 1.125rem;\n --zui-text-lg--line-height: calc(1.75 / 1.125);\n --zui-text-xl: 1.25rem;\n --zui-text-xl--line-height: calc(1.75 / 1.25);\n --zui-text-2xl: 1.5rem;\n --zui-text-2xl--line-height: calc(2 / 1.5);\n --zui-font-weight-normal: 400;\n --zui-font-weight-medium: 500;\n --zui-font-weight-semibold: 600;\n --zui-font-weight-bold: 700;\n --zui-tracking-wide: 0.025em;\n --zui-tracking-wider: 0.05em;\n --zui-leading-snug: 1.375;\n --zui-radius-2xl: 1rem;\n --zui-ease-out: cubic-bezier(0, 0, 0.2, 1);\n --zui-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --zui-animate-spin: spin 1s linear infinite;\n --zui-animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --zui-default-transition-duration: 150ms;\n --zui-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --zui-default-font-family: var(--zui-font-sans);\n --zui-default-mono-font-family: var(--zui-font-mono);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--zui-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n font-feature-settings: var(--zui-default-font-feature-settings, normal);\n font-variation-settings: var(--zui-default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--zui-default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n font-feature-settings: var(--zui-default-mono-font-feature-settings, normal);\n font-variation-settings: var(--zui-default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden="until-found"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .zui\\:pointer-events-none {\n pointer-events: none !important;\n }\n .zui\\:invisible {\n visibility: hidden !important;\n }\n .zui\\:sr-only {\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0, 0, 0, 0) !important;\n white-space: nowrap !important;\n border-width: 0 !important;\n }\n .zui\\:\\!absolute {\n position: absolute !important;\n }\n .zui\\:absolute {\n position: absolute !important;\n }\n .zui\\:relative {\n position: relative !important;\n }\n .zui\\:sticky {\n position: sticky !important;\n }\n .zui\\:inset-y-0 {\n inset-block: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:-top-2\\.5 {\n top: calc(var(--zui-spacing) * -2.5) !important;\n }\n .zui\\:-top-\\[9px\\] {\n top: calc(9px * -1) !important;\n }\n .zui\\:top-0 {\n top: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:top-2 {\n top: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:top-3 {\n top: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:top-16 {\n top: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:right-0 {\n right: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:right-2 {\n right: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:right-3 {\n right: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:right-4 {\n right: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:right-9 {\n right: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:bottom-0 {\n bottom: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:left-0 {\n left: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:left-3 {\n left: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:z-10 {\n z-index: 10 !important;\n }\n .zui\\:z-20 {\n z-index: 20 !important;\n }\n .zui\\:z-30 {\n z-index: 30 !important;\n }\n .zui\\:z-40 {\n z-index: 40 !important;\n }\n .zui\\:z-50 {\n z-index: 50 !important;\n }\n .zui\\:col-span-1 {\n grid-column: span 1 / span 1 !important;\n }\n .zui\\:col-span-2 {\n grid-column: span 2 / span 2 !important;\n }\n .zui\\:col-span-3 {\n grid-column: span 3 / span 3 !important;\n }\n .zui\\:col-span-4 {\n grid-column: span 4 / span 4 !important;\n }\n .zui\\:col-span-5 {\n grid-column: span 5 / span 5 !important;\n }\n .zui\\:col-span-6 {\n grid-column: span 6 / span 6 !important;\n }\n .zui\\:col-span-7 {\n grid-column: span 7 / span 7 !important;\n }\n .zui\\:col-span-8 {\n grid-column: span 8 / span 8 !important;\n }\n .zui\\:col-span-9 {\n grid-column: span 9 / span 9 !important;\n }\n .zui\\:col-span-10 {\n grid-column: span 10 / span 10 !important;\n }\n .zui\\:col-span-11 {\n grid-column: span 11 / span 11 !important;\n }\n .zui\\:col-span-12 {\n grid-column: span 12 / span 12 !important;\n }\n .zui\\:m-0 {\n margin: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:m-0\\.5 {\n margin: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:mx-1 {\n margin-inline: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mx-10 {\n margin-inline: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:mx-auto {\n margin-inline: auto !important;\n }\n .zui\\:\\!my-4 {\n margin-block: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:my-2 {\n margin-block: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mt-0\\.5 {\n margin-top: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:mt-1 {\n margin-top: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mt-1\\.5 {\n margin-top: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:mt-2 {\n margin-top: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mt-4 {\n margin-top: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:mt-6 {\n margin-top: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:mt-8 {\n margin-top: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:mt-10 {\n margin-top: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:mr-1 {\n margin-right: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mr-2 {\n margin-right: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mr-4 {\n margin-right: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:\\!mb-0 {\n margin-bottom: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:mb-1 {\n margin-bottom: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mb-2 {\n margin-bottom: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mb-3 {\n margin-bottom: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:mb-4 {\n margin-bottom: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:mb-6 {\n margin-bottom: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:ml-1 {\n margin-left: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:ml-2 {\n margin-left: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:ml-4 {\n margin-left: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:ml-auto {\n margin-left: auto !important;\n }\n .zui\\:block {\n display: block !important;\n }\n .zui\\:flex {\n display: flex !important;\n }\n .zui\\:grid {\n display: grid !important;\n }\n .zui\\:hidden {\n display: none !important;\n }\n .zui\\:inline-block {\n display: inline-block !important;\n }\n .zui\\:inline-flex {\n display: inline-flex !important;\n }\n .zui\\:size-4 {\n width: calc(var(--zui-spacing) * 4) !important;\n height: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:size-8 {\n width: calc(var(--zui-spacing) * 8) !important;\n height: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:h-0 {\n height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:h-2 {\n height: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:h-3 {\n height: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:h-4 {\n height: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:h-5 {\n height: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:h-6 {\n height: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:h-7 {\n height: calc(var(--zui-spacing) * 7) !important;\n }\n .zui\\:h-8 {\n height: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:h-9 {\n height: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:h-10 {\n height: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:h-11 {\n height: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:h-12 {\n height: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:h-16 {\n height: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:h-96 {\n height: calc(var(--zui-spacing) * 96) !important;\n }\n .zui\\:h-\\[calc\\(100\\%_-_2\\.75rem\\)\\] {\n height: calc(100% - 2.75rem) !important;\n }\n .zui\\:h-full {\n height: 100% !important;\n }\n .zui\\:h-screen {\n height: 100vh !important;\n }\n .zui\\:max-h-0 {\n max-height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:max-h-44 {\n max-height: calc(var(--zui-spacing) * 44) !important;\n }\n .zui\\:max-h-96 {\n max-height: calc(var(--zui-spacing) * 96) !important;\n }\n .zui\\:max-h-\\[70vh\\] {\n max-height: 70vh !important;\n }\n .zui\\:min-h-0 {\n min-height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:min-h-\\[50px\\] {\n min-height: 50px !important;\n }\n .zui\\:min-h-\\[60px\\] {\n min-height: 60px !important;\n }\n .zui\\:min-h-screen {\n min-height: 100vh !important;\n }\n .zui\\:w-2 {\n width: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:w-3 {\n width: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:w-3\\/4 {\n width: calc(3/4 * 100%) !important;\n }\n .zui\\:w-4 {\n width: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:w-5 {\n width: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:w-6 {\n width: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:w-7 {\n width: calc(var(--zui-spacing) * 7) !important;\n }\n .zui\\:w-8 {\n width: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:w-10 {\n width: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:w-12 {\n width: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:w-16 {\n width: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:w-20 {\n width: calc(var(--zui-spacing) * 20) !important;\n }\n .zui\\:w-64 {\n width: calc(var(--zui-spacing) * 64) !important;\n }\n .zui\\:w-72 {\n width: calc(var(--zui-spacing) * 72) !important;\n }\n .zui\\:w-80 {\n width: calc(var(--zui-spacing) * 80) !important;\n }\n .zui\\:w-\\[22rem\\] {\n width: 22rem !important;\n }\n .zui\\:w-full {\n width: 100% !important;\n }\n .zui\\:w-max {\n width: max-content !important;\n }\n .zui\\:max-w-2xl {\n max-width: var(--zui-container-2xl) !important;\n }\n .zui\\:max-w-4xl {\n max-width: var(--zui-container-4xl) !important;\n }\n .zui\\:max-w-md {\n max-width: var(--zui-container-md) !important;\n }\n .zui\\:max-w-sm {\n max-width: var(--zui-container-sm) !important;\n }\n .zui\\:\\!min-w-8 {\n min-width: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:min-w-0 {\n min-width: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:min-w-\\[10rem\\] {\n min-width: 10rem !important;\n }\n .zui\\:min-w-\\[12rem\\] {\n min-width: 12rem !important;\n }\n .zui\\:min-w-\\[14rem\\] {\n min-width: 14rem !important;\n }\n .zui\\:min-w-full {\n min-width: 100% !important;\n }\n .zui\\:flex-1 {\n flex: 1 !important;\n }\n .zui\\:flex-shrink-0 {\n flex-shrink: 0 !important;\n }\n .zui\\:shrink-0 {\n flex-shrink: 0 !important;\n }\n .zui\\:border-separate {\n border-collapse: separate !important;\n }\n .zui\\:border-spacing-0 {\n --tw-border-spacing-x: calc(var(--zui-spacing) * 0) !important;\n --tw-border-spacing-y: calc(var(--zui-spacing) * 0) !important;\n border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y) !important;\n }\n .zui\\:-translate-y-2 {\n --tw-translate-y: calc(var(--zui-spacing) * -2) !important;\n translate: var(--tw-translate-x) var(--tw-translate-y) !important;\n }\n .zui\\:translate-y-0 {\n --tw-translate-y: calc(var(--zui-spacing) * 0) !important;\n translate: var(--tw-translate-x) var(--tw-translate-y) !important;\n }\n .zui\\:scale-95 {\n --tw-scale-x: 95% !important;\n --tw-scale-y: 95% !important;\n --tw-scale-z: 95% !important;\n scale: var(--tw-scale-x) var(--tw-scale-y) !important;\n }\n .zui\\:scale-100 {\n --tw-scale-x: 100% !important;\n --tw-scale-y: 100% !important;\n --tw-scale-z: 100% !important;\n scale: var(--tw-scale-x) var(--tw-scale-y) !important;\n }\n .zui\\:rotate-90 {\n rotate: 90deg !important;\n }\n .zui\\:transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,) !important;\n }\n .zui\\:animate-pulse {\n animation: var(--zui-animate-pulse) !important;\n }\n .zui\\:animate-spin {\n animation: var(--zui-animate-spin) !important;\n }\n .zui\\:cursor-default {\n cursor: default !important;\n }\n .zui\\:cursor-not-allowed {\n cursor: not-allowed !important;\n }\n .zui\\:cursor-pointer {\n cursor: pointer !important;\n }\n .zui\\:resize-none {\n resize: none !important;\n }\n .zui\\:list-inside {\n list-style-position: inside !important;\n }\n .zui\\:list-disc {\n list-style-type: disc !important;\n }\n .zui\\:grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-12 {\n grid-template-columns: repeat(12, minmax(0, 1fr)) !important;\n }\n .zui\\:flex-col {\n flex-direction: column !important;\n }\n .zui\\:flex-row {\n flex-direction: row !important;\n }\n .zui\\:flex-row-reverse {\n flex-direction: row-reverse !important;\n }\n .zui\\:flex-nowrap {\n flex-wrap: nowrap !important;\n }\n .zui\\:flex-wrap {\n flex-wrap: wrap !important;\n }\n .zui\\:items-baseline {\n align-items: baseline !important;\n }\n .zui\\:items-center {\n align-items: center !important;\n }\n .zui\\:items-start {\n align-items: flex-start !important;\n }\n .zui\\:justify-between {\n justify-content: space-between !important;\n }\n .zui\\:justify-center {\n justify-content: center !important;\n }\n .zui\\:justify-end {\n justify-content: flex-end !important;\n }\n .zui\\:justify-start {\n justify-content: flex-start !important;\n }\n .zui\\:gap-0\\.5 {\n gap: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:gap-1 {\n gap: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:gap-1\\.5 {\n gap: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:gap-2 {\n gap: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:gap-3 {\n gap: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:gap-4 {\n gap: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:gap-6 {\n gap: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 1) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 1) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 2) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 2) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 3) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 3) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 4) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 4) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 5) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 5) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 6) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 6) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-8 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 8) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 8) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-x-1 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 1) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 1) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-2 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 2) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 2) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-3 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 3) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 3) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-4 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 4) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 4) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:gap-y-2 {\n row-gap: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:truncate {\n overflow: hidden !important;\n text-overflow: ellipsis !important;\n white-space: nowrap !important;\n }\n .zui\\:overflow-auto {\n overflow: auto !important;\n }\n .zui\\:overflow-hidden {\n overflow: hidden !important;\n }\n .zui\\:overflow-visible {\n overflow: visible !important;\n }\n .zui\\:overflow-x-auto {\n overflow-x: auto !important;\n }\n .zui\\:overflow-y-auto {\n overflow-y: auto !important;\n }\n .zui\\:rounded {\n border-radius: 0.25rem !important;\n }\n .zui\\:rounded-2xl {\n border-radius: var(--zui-radius-2xl) !important;\n }\n .zui\\:rounded-full {\n border-radius: calc(infinity * 1px) !important;\n }\n .zui\\:rounded-lg {\n border-radius: var(--zui-radius) !important;\n }\n .zui\\:rounded-md {\n border-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-none {\n border-radius: 0 !important;\n }\n .zui\\:rounded-sm {\n border-radius: calc(var(--zui-radius) - 4px) !important;\n }\n .zui\\:rounded-xl {\n border-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:rounded-s-md {\n border-start-start-radius: calc(var(--zui-radius) - 2px) !important;\n border-end-start-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-e-md {\n border-start-end-radius: calc(var(--zui-radius) - 2px) !important;\n border-end-end-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-t-lg {\n border-top-left-radius: var(--zui-radius) !important;\n border-top-right-radius: var(--zui-radius) !important;\n }\n .zui\\:rounded-t-xl {\n border-top-left-radius: calc(var(--zui-radius) + 4px) !important;\n border-top-right-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:rounded-l-md {\n border-top-left-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-r-md {\n border-top-right-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-right-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-b-xl {\n border-bottom-right-radius: calc(var(--zui-radius) + 4px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:border {\n border-style: var(--tw-border-style) !important;\n border-width: 1px !important;\n }\n .zui\\:border-0 {\n border-style: var(--tw-border-style) !important;\n border-width: 0px !important;\n }\n .zui\\:border-1 {\n border-style: var(--tw-border-style) !important;\n border-width: 1px !important;\n }\n .zui\\:border-2 {\n border-style: var(--tw-border-style) !important;\n border-width: 2px !important;\n }\n .zui\\:border-t {\n border-top-style: var(--tw-border-style) !important;\n border-top-width: 1px !important;\n }\n .zui\\:border-r {\n border-right-style: var(--tw-border-style) !important;\n border-right-width: 1px !important;\n }\n .zui\\:border-b {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 1px !important;\n }\n .zui\\:border-b-0 {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 0px !important;\n }\n .zui\\:border-b-2 {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 2px !important;\n }\n .zui\\:border-l-0 {\n border-left-style: var(--tw-border-style) !important;\n border-left-width: 0px !important;\n }\n .zui\\:border-l-4 {\n border-left-style: var(--tw-border-style) !important;\n border-left-width: 4px !important;\n }\n .zui\\:border-blue-100 {\n border-color: var(--zui-color-blue-100) !important;\n }\n .zui\\:border-blue-200 {\n border-color: var(--zui-color-blue-200) !important;\n }\n .zui\\:border-blue-500 {\n border-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:border-blue-600 {\n border-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:border-blue-700 {\n border-color: var(--zui-color-blue-700) !important;\n }\n .zui\\:border-border {\n border-color: var(--zui-border) !important;\n }\n .zui\\:border-current {\n border-color: currentcolor !important;\n }\n .zui\\:border-destructive {\n border-color: var(--zui-destructive) !important;\n }\n .zui\\:border-gray-100 {\n border-color: var(--zui-color-gray-100) !important;\n }\n .zui\\:border-gray-200 {\n border-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:border-gray-300 {\n border-color: var(--zui-color-gray-300) !important;\n }\n .zui\\:border-gray-800 {\n border-color: var(--zui-color-gray-800) !important;\n }\n .zui\\:border-green-100 {\n border-color: var(--zui-color-green-100) !important;\n }\n .zui\\:border-green-200 {\n border-color: var(--zui-color-green-200) !important;\n }\n .zui\\:border-green-500 {\n border-color: var(--zui-color-green-500) !important;\n }\n .zui\\:border-green-700 {\n border-color: var(--zui-color-green-700) !important;\n }\n .zui\\:border-input {\n border-color: var(--zui-input) !important;\n }\n .zui\\:border-orange-200 {\n border-color: var(--zui-color-orange-200) !important;\n }\n .zui\\:border-purple-200 {\n border-color: var(--zui-color-purple-200) !important;\n }\n .zui\\:border-purple-500 {\n border-color: var(--zui-color-purple-500) !important;\n }\n .zui\\:border-red-100 {\n border-color: var(--zui-color-red-100) !important;\n }\n .zui\\:border-red-200 {\n border-color: var(--zui-color-red-200) !important;\n }\n .zui\\:border-red-500 {\n border-color: var(--zui-color-red-500) !important;\n }\n .zui\\:border-red-700 {\n border-color: var(--zui-color-red-700) !important;\n }\n .zui\\:border-slate-300 {\n border-color: var(--zui-color-slate-300) !important;\n }\n .zui\\:border-transparent {\n border-color: transparent !important;\n }\n .zui\\:border-yellow-100 {\n border-color: var(--zui-color-yellow-100) !important;\n }\n .zui\\:border-yellow-200 {\n border-color: var(--zui-color-yellow-200) !important;\n }\n .zui\\:border-yellow-600 {\n border-color: var(--zui-color-yellow-600) !important;\n }\n .zui\\:border-yellow-700 {\n border-color: var(--zui-color-yellow-700) !important;\n }\n .zui\\:bg-\\[\\#e1e0e0\\] {\n background-color: #e1e0e0 !important;\n }\n .zui\\:bg-accent {\n background-color: var(--zui-accent) !important;\n }\n .zui\\:bg-amber-50 {\n background-color: var(--zui-color-amber-50) !important;\n }\n .zui\\:bg-amber-100 {\n background-color: var(--zui-color-amber-100) !important;\n }\n .zui\\:bg-amber-500 {\n background-color: var(--zui-color-amber-500) !important;\n }\n .zui\\:bg-background {\n background-color: var(--zui-background) !important;\n }\n .zui\\:bg-blue-50 {\n background-color: var(--zui-color-blue-50) !important;\n }\n .zui\\:bg-blue-100 {\n background-color: var(--zui-color-blue-100) !important;\n }\n .zui\\:bg-blue-500 {\n background-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:bg-blue-600 {\n background-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:bg-current {\n background-color: currentcolor !important;\n }\n .zui\\:bg-gray-50 {\n background-color: var(--zui-color-gray-50) !important;\n }\n .zui\\:bg-gray-100 {\n background-color: var(--zui-color-gray-100) !important;\n }\n .zui\\:bg-gray-200 {\n background-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:bg-gray-800 {\n background-color: var(--zui-color-gray-800) !important;\n }\n .zui\\:bg-gray-900 {\n background-color: var(--zui-color-gray-900) !important;\n }\n .zui\\:bg-green-50 {\n background-color: var(--zui-color-green-50) !important;\n }\n .zui\\:bg-green-100 {\n background-color: var(--zui-color-green-100) !important;\n }\n .zui\\:bg-green-500 {\n background-color: var(--zui-color-green-500) !important;\n }\n .zui\\:bg-inherit {\n background-color: inherit !important;\n }\n .zui\\:bg-muted {\n background-color: var(--zui-muted) !important;\n }\n .zui\\:bg-neutral-100 {\n background-color: var(--zui-color-neutral-100) !important;\n }\n .zui\\:bg-orange-100 {\n background-color: var(--zui-color-orange-100) !important;\n }\n .zui\\:bg-purple-100 {\n background-color: var(--zui-color-purple-100) !important;\n }\n .zui\\:bg-purple-500 {\n background-color: var(--zui-color-purple-500) !important;\n }\n .zui\\:bg-red-50 {\n background-color: var(--zui-color-red-50) !important;\n }\n .zui\\:bg-red-100 {\n background-color: var(--zui-color-red-100) !important;\n }\n .zui\\:bg-red-500 {\n background-color: var(--zui-color-red-500) !important;\n }\n .zui\\:bg-red-600 {\n background-color: var(--zui-color-red-600) !important;\n }\n .zui\\:bg-secondary {\n background-color: var(--zui-secondary) !important;\n }\n .zui\\:bg-slate-200 {\n background-color: var(--zui-color-slate-200) !important;\n }\n .zui\\:bg-transparent {\n background-color: transparent !important;\n }\n .zui\\:bg-white {\n background-color: var(--zui-color-white) !important;\n }\n .zui\\:bg-white\\/60 {\n background-color: var(--zui-color-white) !important;\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--zui-color-white) 60%, transparent) !important;\n }\n }\n .zui\\:bg-yellow-50 {\n background-color: var(--zui-color-yellow-50) !important;\n }\n .zui\\:bg-yellow-100 {\n background-color: var(--zui-color-yellow-100) !important;\n }\n .zui\\:bg-gradient-to-r {\n --tw-gradient-position: to right in oklab !important;\n background-image: linear-gradient(var(--tw-gradient-stops)) !important;\n }\n .zui\\:from-blue-50 {\n --tw-gradient-from: var(--zui-color-blue-50) !important;\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;\n }\n .zui\\:to-gray-50 {\n --tw-gradient-to: var(--zui-color-gray-50) !important;\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;\n }\n .zui\\:object-cover {\n object-fit: cover !important;\n }\n .zui\\:\\!p-0 {\n padding: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:\\!p-1 {\n padding: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:p-0 {\n padding: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:p-1 {\n padding: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:p-2 {\n padding: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:p-2\\.5 {\n padding: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:p-4 {\n padding: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:p-6 {\n padding: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:px-1 {\n padding-inline: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:px-1\\.5 {\n padding-inline: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:px-2 {\n padding-inline: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:px-2\\.5 {\n padding-inline: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:px-3 {\n padding-inline: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:px-3\\.5 {\n padding-inline: calc(var(--zui-spacing) * 3.5) !important;\n }\n .zui\\:px-4 {\n padding-inline: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:px-5 {\n padding-inline: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:px-6 {\n padding-inline: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:px-\\[6px\\] {\n padding-inline: 6px !important;\n }\n .zui\\:py-0 {\n padding-block: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:py-0\\.5 {\n padding-block: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:py-1 {\n padding-block: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:py-1\\.5 {\n padding-block: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:py-2 {\n padding-block: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:py-2\\.5 {\n padding-block: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:py-3 {\n padding-block: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:py-4 {\n padding-block: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:py-6 {\n padding-block: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:py-10 {\n padding-block: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:py-12 {\n padding-block: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:py-16 {\n padding-block: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:pt-0\\.5 {\n padding-top: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:pt-1 {\n padding-top: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:pr-3 {\n padding-right: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:pr-8 {\n padding-right: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:pr-9 {\n padding-right: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:pr-10 {\n padding-right: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:pr-11 {\n padding-right: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:pl-3 {\n padding-left: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:pl-8 {\n padding-left: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:pl-9 {\n padding-left: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:pl-10 {\n padding-left: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:pl-11 {\n padding-left: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:text-center {\n text-align: center !important;\n }\n .zui\\:text-left {\n text-align: left !important;\n }\n .zui\\:text-right {\n text-align: right !important;\n }\n .zui\\:align-middle {\n vertical-align: middle !important;\n }\n .zui\\:font-mono {\n font-family: var(--zui-font-mono) !important;\n }\n .zui\\:\\!text-base {\n font-size: var(--zui-text-base) !important;\n line-height: var(--tw-leading, var(--zui-text-base--line-height)) !important;\n }\n .zui\\:\\!text-sm {\n font-size: var(--zui-text-sm) !important;\n line-height: var(--tw-leading, var(--zui-text-sm--line-height)) !important;\n }\n .zui\\:text-2xl {\n font-size: var(--zui-text-2xl) !important;\n line-height: var(--tw-leading, var(--zui-text-2xl--line-height)) !important;\n }\n .zui\\:text-base {\n font-size: var(--zui-text-base) !important;\n line-height: var(--tw-leading, var(--zui-text-base--line-height)) !important;\n }\n .zui\\:text-lg {\n font-size: var(--zui-text-lg) !important;\n line-height: var(--tw-leading, var(--zui-text-lg--line-height)) !important;\n }\n .zui\\:text-sm {\n font-size: var(--zui-text-sm) !important;\n line-height: var(--tw-leading, var(--zui-text-sm--line-height)) !important;\n }\n .zui\\:text-xl {\n font-size: var(--zui-text-xl) !important;\n line-height: var(--tw-leading, var(--zui-text-xl--line-height)) !important;\n }\n .zui\\:text-xs {\n font-size: var(--zui-text-xs) !important;\n line-height: var(--tw-leading, var(--zui-text-xs--line-height)) !important;\n }\n .zui\\:leading-none {\n --tw-leading: 1 !important;\n line-height: 1 !important;\n }\n .zui\\:leading-snug {\n --tw-leading: var(--zui-leading-snug) !important;\n line-height: var(--zui-leading-snug) !important;\n }\n .zui\\:font-bold {\n --tw-font-weight: var(--zui-font-weight-bold) !important;\n font-weight: var(--zui-font-weight-bold) !important;\n }\n .zui\\:font-medium {\n --tw-font-weight: var(--zui-font-weight-medium) !important;\n font-weight: var(--zui-font-weight-medium) !important;\n }\n .zui\\:font-normal {\n --tw-font-weight: var(--zui-font-weight-normal) !important;\n font-weight: var(--zui-font-weight-normal) !important;\n }\n .zui\\:font-semibold {\n --tw-font-weight: var(--zui-font-weight-semibold) !important;\n font-weight: var(--zui-font-weight-semibold) !important;\n }\n .zui\\:tracking-wide {\n --tw-tracking: var(--zui-tracking-wide) !important;\n letter-spacing: var(--zui-tracking-wide) !important;\n }\n .zui\\:tracking-wider {\n --tw-tracking: var(--zui-tracking-wider) !important;\n letter-spacing: var(--zui-tracking-wider) !important;\n }\n .zui\\:whitespace-nowrap {\n white-space: nowrap !important;\n }\n .zui\\:\\!text-foreground {\n color: var(--zui-foreground) !important;\n }\n .zui\\:text-accent-foreground {\n color: var(--zui-accent-foreground) !important;\n }\n .zui\\:text-amber-600 {\n color: var(--zui-color-amber-600) !important;\n }\n .zui\\:text-amber-700 {\n color: var(--zui-color-amber-700) !important;\n }\n .zui\\:text-blue-500 {\n color: var(--zui-color-blue-500) !important;\n }\n .zui\\:text-blue-600 {\n color: var(--zui-color-blue-600) !important;\n }\n .zui\\:text-blue-700 {\n color: var(--zui-color-blue-700) !important;\n }\n .zui\\:text-blue-800 {\n color: var(--zui-color-blue-800) !important;\n }\n .zui\\:text-blue-900 {\n color: var(--zui-color-blue-900) !important;\n }\n .zui\\:text-destructive {\n color: var(--zui-destructive) !important;\n }\n .zui\\:text-foreground {\n color: var(--zui-foreground) !important;\n }\n .zui\\:text-gray-300 {\n color: var(--zui-color-gray-300) !important;\n }\n .zui\\:text-gray-400 {\n color: var(--zui-color-gray-400) !important;\n }\n .zui\\:text-gray-500 {\n color: var(--zui-color-gray-500) !important;\n }\n .zui\\:text-gray-600 {\n color: var(--zui-color-gray-600) !important;\n }\n .zui\\:text-gray-700 {\n color: var(--zui-color-gray-700) !important;\n }\n .zui\\:text-gray-800 {\n color: var(--zui-color-gray-800) !important;\n }\n .zui\\:text-gray-900 {\n color: var(--zui-color-gray-900) !important;\n }\n .zui\\:text-green-500 {\n color: var(--zui-color-green-500) !important;\n }\n .zui\\:text-green-600 {\n color: var(--zui-color-green-600) !important;\n }\n .zui\\:text-green-700 {\n color: var(--zui-color-green-700) !important;\n }\n .zui\\:text-green-800 {\n color: var(--zui-color-green-800) !important;\n }\n .zui\\:text-green-900 {\n color: var(--zui-color-green-900) !important;\n }\n .zui\\:text-muted-foreground {\n color: var(--zui-muted-foreground) !important;\n }\n .zui\\:text-neutral-400 {\n color: var(--zui-color-neutral-400) !important;\n }\n .zui\\:text-orange-800 {\n color: var(--zui-color-orange-800) !important;\n }\n .zui\\:text-popover-foreground {\n color: var(--zui-popover-foreground) !important;\n }\n .zui\\:text-purple-600 {\n color: var(--zui-color-purple-600) !important;\n }\n .zui\\:text-purple-800 {\n color: var(--zui-color-purple-800) !important;\n }\n .zui\\:text-red-500 {\n color: var(--zui-color-red-500) !important;\n }\n .zui\\:text-red-600 {\n color: var(--zui-color-red-600) !important;\n }\n .zui\\:text-red-700 {\n color: var(--zui-color-red-700) !important;\n }\n .zui\\:text-red-800 {\n color: var(--zui-color-red-800) !important;\n }\n .zui\\:text-red-900 {\n color: var(--zui-color-red-900) !important;\n }\n .zui\\:text-slate-500 {\n color: var(--zui-color-slate-500) !important;\n }\n .zui\\:text-slate-800 {\n color: var(--zui-color-slate-800) !important;\n }\n .zui\\:text-white {\n color: var(--zui-color-white) !important;\n }\n .zui\\:text-yellow-400 {\n color: var(--zui-color-yellow-400) !important;\n }\n .zui\\:text-yellow-600 {\n color: var(--zui-color-yellow-600) !important;\n }\n .zui\\:text-yellow-700 {\n color: var(--zui-color-yellow-700) !important;\n }\n .zui\\:text-yellow-800 {\n color: var(--zui-color-yellow-800) !important;\n }\n .zui\\:text-yellow-900 {\n color: var(--zui-color-yellow-900) !important;\n }\n .zui\\:uppercase {\n text-transform: uppercase !important;\n }\n .zui\\:underline {\n text-decoration-line: underline !important;\n }\n .zui\\:opacity-0 {\n opacity: 0% !important;\n }\n .zui\\:opacity-40 {\n opacity: 40% !important;\n }\n .zui\\:opacity-50 {\n opacity: 50% !important;\n }\n .zui\\:opacity-60 {\n opacity: 60% !important;\n }\n .zui\\:opacity-80 {\n opacity: 80% !important;\n }\n .zui\\:opacity-100 {\n opacity: 100% !important;\n }\n .zui\\:shadow-\\[-2px_0_5px_-2px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: -2px 0 5px -2px var(--tw-shadow-color, rgba(0,0,0,0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-\\[2px_0_5px_-2px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 0 5px -2px var(--tw-shadow-color, rgba(0,0,0,0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-xs {\n --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-blue-200 {\n --tw-ring-color: var(--zui-color-blue-200) !important;\n }\n .zui\\:ring-blue-500 {\n --tw-ring-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:ring-blue-600 {\n --tw-ring-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:ring-gray-200 {\n --tw-ring-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:ring-ring {\n --tw-ring-color: var(--zui-ring) !important;\n }\n .zui\\:ring-offset-1 {\n --tw-ring-offset-width: 1px !important;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;\n }\n .zui\\:ring-offset-background {\n --tw-ring-offset-color: var(--zui-background) !important;\n }\n .zui\\:transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-all {\n transition-property: all !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-none {\n transition-property: none !important;\n }\n .zui\\:duration-150 {\n --tw-duration: 150ms !important;\n transition-duration: 150ms !important;\n }\n .zui\\:duration-200 {\n --tw-duration: 200ms !important;\n transition-duration: 200ms !important;\n }\n .zui\\:duration-300 {\n --tw-duration: 300ms !important;\n transition-duration: 300ms !important;\n }\n .zui\\:duration-500 {\n --tw-duration: 500ms !important;\n transition-duration: 500ms !important;\n }\n .zui\\:ease-in-out {\n --tw-ease: var(--zui-ease-in-out) !important;\n transition-timing-function: var(--zui-ease-in-out) !important;\n }\n .zui\\:ease-out {\n --tw-ease: var(--zui-ease-out) !important;\n transition-timing-function: var(--zui-ease-out) !important;\n }\n .zui\\:outline-none {\n --tw-outline-style: none !important;\n outline-style: none !important;\n }\n .zui\\:select-none {\n -webkit-user-select: none !important;\n user-select: none !important;\n }\n .zui\\:placeholder\\:text-muted-foreground {\n &::placeholder {\n color: var(--zui-muted-foreground) !important;\n }\n }\n .zui\\:focus-within\\:ring-1 {\n &:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n }\n .zui\\:focus-within\\:ring-destructive {\n &:focus-within {\n --tw-ring-color: var(--zui-destructive) !important;\n }\n }\n .zui\\:focus-within\\:ring-ring {\n &:focus-within {\n --tw-ring-color: var(--zui-ring) !important;\n }\n }\n .zui\\:focus-within\\:ring-offset-1 {\n &:focus-within {\n --tw-ring-offset-width: 1px !important;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;\n }\n }\n .zui\\:hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--zui-color-gray-400) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-50) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-100 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-100) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-200) !important;\n }\n }\n }\n .zui\\:hover\\:text-blue-800 {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-blue-800) !important;\n }\n }\n }\n .zui\\:hover\\:text-red-500 {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-red-500) !important;\n }\n }\n }\n .zui\\:hover\\:underline {\n &:hover {\n @media (hover: hover) {\n text-decoration-line: underline !important;\n }\n }\n }\n .zui\\:hover\\:opacity-100 {\n &:hover {\n @media (hover: hover) {\n opacity: 100% !important;\n }\n }\n }\n .zui\\:focus\\:outline-none {\n &:focus {\n --tw-outline-style: none !important;\n outline-style: none !important;\n }\n }\n .zui\\:disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed !important;\n }\n }\n .zui\\:disabled\\:opacity-50 {\n &:disabled {\n opacity: 50% !important;\n }\n }\n .zui\\:aria-selected\\:bg-accent\\/50 {\n &[aria-selected="true"] {\n background-color: var(--zui-accent) !important;\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--zui-accent) 50%, transparent) !important;\n }\n }\n }\n .zui\\:aria-selected\\:text-muted-foreground {\n &[aria-selected="true"] {\n color: var(--zui-muted-foreground) !important;\n }\n }\n .zui\\:aria-selected\\:opacity-30 {\n &[aria-selected="true"] {\n opacity: 30% !important;\n }\n }\n .zui\\:aria-selected\\:opacity-100 {\n &[aria-selected="true"] {\n opacity: 100% !important;\n }\n }\n .zui\\:data-\\[disabled\\]\\:pointer-events-none {\n &[data-disabled] {\n pointer-events: none !important;\n }\n }\n .zui\\:data-\\[disabled\\]\\:opacity-50 {\n &[data-disabled] {\n opacity: 50% !important;\n }\n }\n .zui\\:sm\\:w-auto {\n @media (width >= 40rem) {\n width: auto !important;\n }\n }\n .zui\\:sm\\:rounded-l-md {\n @media (width >= 40rem) {\n border-top-left-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) - 2px) !important;\n }\n }\n .zui\\:sm\\:rounded-r-xl {\n @media (width >= 40rem) {\n border-top-right-radius: calc(var(--zui-radius) + 4px) !important;\n border-bottom-right-radius: calc(var(--zui-radius) + 4px) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-accent {\n &>button {\n background-color: var(--zui-accent) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-primary {\n &>button {\n background-color: var(--zui-primary) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-transparent {\n &>button {\n background-color: transparent !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:\\!text-foreground {\n &>button {\n color: var(--zui-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-accent-foreground {\n &>button {\n color: var(--zui-accent-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-foreground {\n &>button {\n color: var(--zui-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-primary-foreground {\n &>button {\n color: var(--zui-primary-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:bg-primary {\n &>button {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-primary) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:bg-transparent {\n &>button {\n &:hover {\n @media (hover: hover) {\n background-color: transparent !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:\\!text-foreground {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-foreground) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:text-gray-500 {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-gray-500) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:text-primary-foreground {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-primary-foreground) !important;\n }\n }\n }\n }\n}\n:root {\n --zui-radius: 0.625rem;\n --zui-background: oklch(1 0 0);\n --zui-foreground: oklch(0.145 0 0);\n --zui-card: oklch(1 0 0);\n --zui-card-foreground: oklch(0.145 0 0);\n --zui-popover: oklch(1 0 0);\n --zui-popover-foreground: oklch(0.145 0 0);\n --zui-primary: oklch(0.55 0.247 266.93);\n --zui-primary-foreground: oklch(0.985 0 0);\n --zui-secondary: oklch(0.97 0 0);\n --zui-secondary-foreground: oklch(0.205 0 0);\n --zui-muted: oklch(0.97 0 0);\n --zui-muted-foreground: oklch(0.556 0 0);\n --zui-accent: oklch(0.97 0 0);\n --zui-accent-foreground: oklch(0.205 0 0);\n --zui-destructive: oklch(0.577 0.245 27.325);\n --zui-border: oklch(0.922 0 0);\n --zui-input: oklch(0.922 0 0);\n --zui-ring: oklch(0.708 0 0);\n --zui-chart-1: oklch(0.646 0.222 41.116);\n --zui-chart-2: oklch(0.6 0.118 184.704);\n --zui-chart-3: oklch(0.398 0.07 227.392);\n --zui-chart-4: oklch(0.828 0.189 84.429);\n --zui-chart-5: oklch(0.769 0.188 70.08);\n --zui-sidebar: oklch(0.985 0 0);\n --zui-sidebar-foreground: oklch(0.145 0 0);\n --zui-sidebar-primary: oklch(0.205 0 0);\n --zui-sidebar-primary-foreground: oklch(0.985 0 0);\n --zui-sidebar-accent: oklch(0.97 0 0);\n --zui-sidebar-accent-foreground: oklch(0.205 0 0);\n --zui-sidebar-border: oklch(0.922 0 0);\n --zui-sidebar-ring: oklch(0.708 0 0);\n}\n@property --tw-border-spacing-x {\n syntax: "<length>";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-spacing-y {\n syntax: "<length>";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-x {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-space-y-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-space-x-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: "*";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: "*";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: "*";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: "<length>";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: "*";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-duration {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ease {\n syntax: "*";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-space-x-reverse: 0;\n --tw-border-style: solid;\n --tw-gradient-position: initial;\n --tw-gradient-from: #0000;\n --tw-gradient-via: #0000;\n --tw-gradient-to: #0000;\n --tw-gradient-stops: initial;\n --tw-gradient-via-stops: initial;\n --tw-gradient-from-position: 0%;\n --tw-gradient-via-position: 50%;\n --tw-gradient-to-position: 100%;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n');var m=function(n){var t=n.open,c=n.onClose,u=n.title,m=n.children,d=n.footer,z=n.side,g=void 0===z?"right":z,v=n.className,h=n.showCloseIcon,w=void 0===h||h,b=n.withOverlay,x=void 0===b||b,f=n.stickyFooter,y=void 0===f||f,k=n.width,j=n.height,C="left"===g||"right"===g;return r(a,{anchor:g,open:t,onClose:c,ModalProps:{keepMounted:!0},hideBackdrop:!x,PaperProps:{style:{width:C?null!=k?k:400:void 0,height:C?"100%":null!=j?j:400},className:p("zui:bg-background zui:shadow-lg zui:border-border zui:flex zui:flex-col",C?"zui:h-full zui:rounded-none zui:sm:rounded-l-md":"zui:w-full zui:sm:w-auto","left"===g&&"zui:sm:rounded-r-xl zui:border-r zui:border-l-0","top"===g&&"zui:rounded-b-xl","bottom"===g&&"zui:rounded-t-xl",v)},children:[r(e,{className:"zui:p-4 zui:flex zui:items-center zui:justify-between zui:border-b zui:border-border",children:[o(i,{size:"sm",fontWeight:600,children:u}),w&&o(l,{onClick:c,size:"small",className:"zui:hover:text-red-500",children:o(s,{className:"zui:h-4 zui:w-4"})})]}),o(e,{className:"zui:flex-1 zui:overflow-y-auto zui:p-4",children:m}),d&&o(e,{className:p("zui:border-t zui:border-border zui:p-2",y&&"zui:sticky zui:bottom-0 zui:bg-background"),children:d})]})};export{m as Drawer,i as Text,p as cn};
1
+ import{s as n}from"./chunks/index-5b35e7d9.esm.js";export{U as UILibraryThemeProvider,c as createCustomTheme,d as designTokens,t as theme}from"./chunks/index-5b35e7d9.esm.js";export{Button}from"./components/Button/index.esm.js";export{Popover}from"./components/Popover/index.esm.js";export{CardActions,CardContent,CardHeader,CardImage,CardRoot,CardSkeleton}from"./components/Card/index.esm.js";export{Select}from"./components/Select/index.esm.js";export{Accordion,AccordionContent,AccordionItem,AccordionTrigger}from"./components/Accordion/index.esm.js";export{default as Switch}from"./components/Switch/index.esm.js";export{RadioGroup}from"./components/RadioGroup/index.esm.js";export{H as Heading}from"./chunks/Heading-b91e2c5f.esm.js";import{T as i}from"./chunks/Text-f18219bd.esm.js";export{Blockquote,Caption,Code,Lead,Strong}from"./components/Typography/index.esm.js";export{M as Muted}from"./chunks/Muted-bfc4985b.esm.js";export{Modal}from"./components/Modal/index.esm.js";import{jsxs as r,jsx as o}from"react/jsx-runtime";import{Drawer as a,Box as e,IconButton as l}from"@mui/material";import{c as p}from"./chunks/index-c6541658.esm.js";export{u as useStableId}from"./chunks/index-c6541658.esm.js";import"./chunks/tslib.es6-49e5b83c.esm.js";import{X as s}from"./chunks/lucide-8c9441ea.esm.js";export{Badge}from"./components/Badge/index.esm.js";export{Input}from"./components/Input/index.esm.js";export{Notice}from"./components/Notice/index.esm.js";export{DatePicker}from"./components/DatePicker/index.esm.js";export{DateRangePicker}from"./components/DateRangePicker/index.esm.js";export{Form}from"./components/Form/index.esm.js";export{Checkbox}from"./components/Checkbox/index.esm.js";export{CheckboxGroup}from"./components/CheckboxGroup/index.esm.js";export{Radio}from"./components/Radio/index.esm.js";export{PopupConfirm}from"./components/PopupConfirm/index.esm.js";export{GlobalMenuSearch}from"./components/GlobalMenuSearch/index.esm.js";export{AppList}from"./components/AppList/index.esm.js";export{Table}from"./components/Table/index.esm.js";export{BulkActionsBar}from"./components/BulkActionsBar/index.esm.js";export{TimePicker}from"./components/TimePicker/index.esm.js";export{DataTable}from"./components/DataTable/index.esm.js";import"@mui/material/styles";import"react";import"@mui/material/CardContent";import"@mui/material/CardMedia";import"./chunks/typeof-cc63ab7d.esm.js";import"./chunks/assertThisInitialized-406be690.esm.js";import"@emotion/react";import"react-dom";import"./chunks/Calender-a4ec1295.esm.js";import"@mui/material/IconButton";import"@mui/material/List";import"@mui/material/ListItemText";import"@mui/material/ListItemIcon";import"@mui/material/Popover";n('/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --zui-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",\n "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n --zui-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",\n "Courier New", monospace;\n --zui-color-red-50: oklch(97.1% 0.013 17.38);\n --zui-color-red-100: oklch(93.6% 0.032 17.717);\n --zui-color-red-200: oklch(88.5% 0.062 18.334);\n --zui-color-red-500: oklch(63.7% 0.237 25.331);\n --zui-color-red-600: oklch(57.7% 0.245 27.325);\n --zui-color-red-700: oklch(50.5% 0.213 27.518);\n --zui-color-red-800: oklch(44.4% 0.177 26.899);\n --zui-color-red-900: oklch(39.6% 0.141 25.723);\n --zui-color-orange-100: oklch(95.4% 0.038 75.164);\n --zui-color-orange-200: oklch(90.1% 0.076 70.697);\n --zui-color-orange-800: oklch(47% 0.157 37.304);\n --zui-color-amber-50: oklch(98.7% 0.022 95.277);\n --zui-color-amber-100: oklch(96.2% 0.059 95.617);\n --zui-color-amber-500: oklch(76.9% 0.188 70.08);\n --zui-color-amber-600: oklch(66.6% 0.179 58.318);\n --zui-color-amber-700: oklch(55.5% 0.163 48.998);\n --zui-color-yellow-50: oklch(98.7% 0.026 102.212);\n --zui-color-yellow-100: oklch(97.3% 0.071 103.193);\n --zui-color-yellow-200: oklch(94.5% 0.129 101.54);\n --zui-color-yellow-400: oklch(85.2% 0.199 91.936);\n --zui-color-yellow-600: oklch(68.1% 0.162 75.834);\n --zui-color-yellow-700: oklch(55.4% 0.135 66.442);\n --zui-color-yellow-800: oklch(47.6% 0.114 61.907);\n --zui-color-yellow-900: oklch(42.1% 0.095 57.708);\n --zui-color-green-50: oklch(98.2% 0.018 155.826);\n --zui-color-green-100: oklch(96.2% 0.044 156.743);\n --zui-color-green-200: oklch(92.5% 0.084 155.995);\n --zui-color-green-500: oklch(72.3% 0.219 149.579);\n --zui-color-green-600: oklch(62.7% 0.194 149.214);\n --zui-color-green-700: oklch(52.7% 0.154 150.069);\n --zui-color-green-800: oklch(44.8% 0.119 151.328);\n --zui-color-green-900: oklch(39.3% 0.095 152.535);\n --zui-color-blue-50: oklch(97% 0.014 254.604);\n --zui-color-blue-100: oklch(93.2% 0.032 255.585);\n --zui-color-blue-200: oklch(88.2% 0.059 254.128);\n --zui-color-blue-500: oklch(62.3% 0.214 259.815);\n --zui-color-blue-600: oklch(54.6% 0.245 262.881);\n --zui-color-blue-700: oklch(48.8% 0.243 264.376);\n --zui-color-blue-800: oklch(42.4% 0.199 265.638);\n --zui-color-blue-900: oklch(37.9% 0.146 265.522);\n --zui-color-purple-100: oklch(94.6% 0.033 307.174);\n --zui-color-purple-200: oklch(90.2% 0.063 306.703);\n --zui-color-purple-500: oklch(62.7% 0.265 303.9);\n --zui-color-purple-600: oklch(55.8% 0.288 302.321);\n --zui-color-purple-800: oklch(43.8% 0.218 303.724);\n --zui-color-slate-200: oklch(92.9% 0.013 255.508);\n --zui-color-slate-300: oklch(86.9% 0.022 252.894);\n --zui-color-slate-500: oklch(55.4% 0.046 257.417);\n --zui-color-slate-800: oklch(27.9% 0.041 260.031);\n --zui-color-gray-50: oklch(98.5% 0.002 247.839);\n --zui-color-gray-100: oklch(96.7% 0.003 264.542);\n --zui-color-gray-200: oklch(92.8% 0.006 264.531);\n --zui-color-gray-300: oklch(87.2% 0.01 258.338);\n --zui-color-gray-400: oklch(70.7% 0.022 261.325);\n --zui-color-gray-500: oklch(55.1% 0.027 264.364);\n --zui-color-gray-600: oklch(44.6% 0.03 256.802);\n --zui-color-gray-700: oklch(37.3% 0.034 259.733);\n --zui-color-gray-800: oklch(27.8% 0.033 256.848);\n --zui-color-gray-900: oklch(21% 0.034 264.665);\n --zui-color-neutral-100: oklch(97% 0 0);\n --zui-color-neutral-400: oklch(70.8% 0 0);\n --zui-color-white: #fff;\n --zui-spacing: 0.25rem;\n --zui-container-sm: 24rem;\n --zui-container-md: 28rem;\n --zui-container-2xl: 42rem;\n --zui-container-4xl: 56rem;\n --zui-text-xs: 0.75rem;\n --zui-text-xs--line-height: calc(1 / 0.75);\n --zui-text-sm: 0.875rem;\n --zui-text-sm--line-height: calc(1.25 / 0.875);\n --zui-text-base: 1rem;\n --zui-text-base--line-height: calc(1.5 / 1);\n --zui-text-lg: 1.125rem;\n --zui-text-lg--line-height: calc(1.75 / 1.125);\n --zui-text-xl: 1.25rem;\n --zui-text-xl--line-height: calc(1.75 / 1.25);\n --zui-text-2xl: 1.5rem;\n --zui-text-2xl--line-height: calc(2 / 1.5);\n --zui-font-weight-normal: 400;\n --zui-font-weight-medium: 500;\n --zui-font-weight-semibold: 600;\n --zui-font-weight-bold: 700;\n --zui-tracking-wide: 0.025em;\n --zui-tracking-wider: 0.05em;\n --zui-leading-snug: 1.375;\n --zui-radius-2xl: 1rem;\n --zui-ease-out: cubic-bezier(0, 0, 0.2, 1);\n --zui-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --zui-animate-spin: spin 1s linear infinite;\n --zui-animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n --zui-default-transition-duration: 150ms;\n --zui-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --zui-default-font-family: var(--zui-font-sans);\n --zui-default-mono-font-family: var(--zui-font-mono);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--zui-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n font-feature-settings: var(--zui-default-font-feature-settings, normal);\n font-variation-settings: var(--zui-default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--zui-default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n font-feature-settings: var(--zui-default-mono-font-feature-settings, normal);\n font-variation-settings: var(--zui-default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden="until-found"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .zui\\:pointer-events-none {\n pointer-events: none !important;\n }\n .zui\\:invisible {\n visibility: hidden !important;\n }\n .zui\\:sr-only {\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0, 0, 0, 0) !important;\n white-space: nowrap !important;\n border-width: 0 !important;\n }\n .zui\\:\\!absolute {\n position: absolute !important;\n }\n .zui\\:absolute {\n position: absolute !important;\n }\n .zui\\:relative {\n position: relative !important;\n }\n .zui\\:sticky {\n position: sticky !important;\n }\n .zui\\:inset-y-0 {\n inset-block: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:-top-2\\.5 {\n top: calc(var(--zui-spacing) * -2.5) !important;\n }\n .zui\\:-top-\\[9px\\] {\n top: calc(9px * -1) !important;\n }\n .zui\\:top-0 {\n top: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:top-2 {\n top: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:top-3 {\n top: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:top-16 {\n top: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:right-0 {\n right: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:right-2 {\n right: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:right-3 {\n right: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:right-4 {\n right: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:right-9 {\n right: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:bottom-0 {\n bottom: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:left-0 {\n left: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:left-3 {\n left: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:z-10 {\n z-index: 10 !important;\n }\n .zui\\:z-20 {\n z-index: 20 !important;\n }\n .zui\\:z-30 {\n z-index: 30 !important;\n }\n .zui\\:z-40 {\n z-index: 40 !important;\n }\n .zui\\:z-50 {\n z-index: 50 !important;\n }\n .zui\\:col-span-1 {\n grid-column: span 1 / span 1 !important;\n }\n .zui\\:col-span-2 {\n grid-column: span 2 / span 2 !important;\n }\n .zui\\:col-span-3 {\n grid-column: span 3 / span 3 !important;\n }\n .zui\\:col-span-4 {\n grid-column: span 4 / span 4 !important;\n }\n .zui\\:col-span-5 {\n grid-column: span 5 / span 5 !important;\n }\n .zui\\:col-span-6 {\n grid-column: span 6 / span 6 !important;\n }\n .zui\\:col-span-7 {\n grid-column: span 7 / span 7 !important;\n }\n .zui\\:col-span-8 {\n grid-column: span 8 / span 8 !important;\n }\n .zui\\:col-span-9 {\n grid-column: span 9 / span 9 !important;\n }\n .zui\\:col-span-10 {\n grid-column: span 10 / span 10 !important;\n }\n .zui\\:col-span-11 {\n grid-column: span 11 / span 11 !important;\n }\n .zui\\:col-span-12 {\n grid-column: span 12 / span 12 !important;\n }\n .zui\\:m-0 {\n margin: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:m-0\\.5 {\n margin: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:mx-1 {\n margin-inline: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mx-10 {\n margin-inline: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:mx-auto {\n margin-inline: auto !important;\n }\n .zui\\:\\!my-4 {\n margin-block: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:my-2 {\n margin-block: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mt-0\\.5 {\n margin-top: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:mt-1 {\n margin-top: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mt-1\\.5 {\n margin-top: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:mt-2 {\n margin-top: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mt-4 {\n margin-top: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:mt-6 {\n margin-top: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:mt-8 {\n margin-top: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:mt-10 {\n margin-top: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:mr-1 {\n margin-right: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mr-2 {\n margin-right: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mr-4 {\n margin-right: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:\\!mb-0 {\n margin-bottom: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:mb-1 {\n margin-bottom: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:mb-2 {\n margin-bottom: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:mb-3 {\n margin-bottom: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:mb-4 {\n margin-bottom: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:mb-6 {\n margin-bottom: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:ml-1 {\n margin-left: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:ml-2 {\n margin-left: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:ml-4 {\n margin-left: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:ml-auto {\n margin-left: auto !important;\n }\n .zui\\:block {\n display: block !important;\n }\n .zui\\:flex {\n display: flex !important;\n }\n .zui\\:grid {\n display: grid !important;\n }\n .zui\\:hidden {\n display: none !important;\n }\n .zui\\:inline-block {\n display: inline-block !important;\n }\n .zui\\:inline-flex {\n display: inline-flex !important;\n }\n .zui\\:size-4 {\n width: calc(var(--zui-spacing) * 4) !important;\n height: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:size-8 {\n width: calc(var(--zui-spacing) * 8) !important;\n height: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:h-0 {\n height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:h-2 {\n height: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:h-3 {\n height: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:h-4 {\n height: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:h-5 {\n height: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:h-6 {\n height: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:h-7 {\n height: calc(var(--zui-spacing) * 7) !important;\n }\n .zui\\:h-8 {\n height: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:h-9 {\n height: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:h-10 {\n height: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:h-11 {\n height: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:h-12 {\n height: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:h-16 {\n height: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:h-96 {\n height: calc(var(--zui-spacing) * 96) !important;\n }\n .zui\\:h-\\[calc\\(100\\%_-_2\\.75rem\\)\\] {\n height: calc(100% - 2.75rem) !important;\n }\n .zui\\:h-full {\n height: 100% !important;\n }\n .zui\\:h-screen {\n height: 100vh !important;\n }\n .zui\\:max-h-0 {\n max-height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:max-h-44 {\n max-height: calc(var(--zui-spacing) * 44) !important;\n }\n .zui\\:max-h-96 {\n max-height: calc(var(--zui-spacing) * 96) !important;\n }\n .zui\\:max-h-\\[70vh\\] {\n max-height: 70vh !important;\n }\n .zui\\:min-h-0 {\n min-height: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:min-h-\\[50px\\] {\n min-height: 50px !important;\n }\n .zui\\:min-h-\\[60px\\] {\n min-height: 60px !important;\n }\n .zui\\:min-h-screen {\n min-height: 100vh !important;\n }\n .zui\\:w-2 {\n width: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:w-3 {\n width: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:w-3\\/4 {\n width: calc(3/4 * 100%) !important;\n }\n .zui\\:w-4 {\n width: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:w-5 {\n width: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:w-6 {\n width: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:w-7 {\n width: calc(var(--zui-spacing) * 7) !important;\n }\n .zui\\:w-8 {\n width: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:w-10 {\n width: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:w-12 {\n width: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:w-14 {\n width: calc(var(--zui-spacing) * 14) !important;\n }\n .zui\\:w-16 {\n width: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:w-20 {\n width: calc(var(--zui-spacing) * 20) !important;\n }\n .zui\\:w-64 {\n width: calc(var(--zui-spacing) * 64) !important;\n }\n .zui\\:w-72 {\n width: calc(var(--zui-spacing) * 72) !important;\n }\n .zui\\:w-80 {\n width: calc(var(--zui-spacing) * 80) !important;\n }\n .zui\\:w-\\[22rem\\] {\n width: 22rem !important;\n }\n .zui\\:w-full {\n width: 100% !important;\n }\n .zui\\:w-max {\n width: max-content !important;\n }\n .zui\\:max-w-2xl {\n max-width: var(--zui-container-2xl) !important;\n }\n .zui\\:max-w-4xl {\n max-width: var(--zui-container-4xl) !important;\n }\n .zui\\:max-w-md {\n max-width: var(--zui-container-md) !important;\n }\n .zui\\:max-w-sm {\n max-width: var(--zui-container-sm) !important;\n }\n .zui\\:\\!min-w-8 {\n min-width: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:min-w-0 {\n min-width: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:min-w-\\[10rem\\] {\n min-width: 10rem !important;\n }\n .zui\\:min-w-\\[12rem\\] {\n min-width: 12rem !important;\n }\n .zui\\:min-w-\\[14rem\\] {\n min-width: 14rem !important;\n }\n .zui\\:min-w-full {\n min-width: 100% !important;\n }\n .zui\\:flex-1 {\n flex: 1 !important;\n }\n .zui\\:flex-shrink-0 {\n flex-shrink: 0 !important;\n }\n .zui\\:shrink-0 {\n flex-shrink: 0 !important;\n }\n .zui\\:border-separate {\n border-collapse: separate !important;\n }\n .zui\\:border-spacing-0 {\n --tw-border-spacing-x: calc(var(--zui-spacing) * 0) !important;\n --tw-border-spacing-y: calc(var(--zui-spacing) * 0) !important;\n border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y) !important;\n }\n .zui\\:-translate-y-2 {\n --tw-translate-y: calc(var(--zui-spacing) * -2) !important;\n translate: var(--tw-translate-x) var(--tw-translate-y) !important;\n }\n .zui\\:translate-y-0 {\n --tw-translate-y: calc(var(--zui-spacing) * 0) !important;\n translate: var(--tw-translate-x) var(--tw-translate-y) !important;\n }\n .zui\\:scale-95 {\n --tw-scale-x: 95% !important;\n --tw-scale-y: 95% !important;\n --tw-scale-z: 95% !important;\n scale: var(--tw-scale-x) var(--tw-scale-y) !important;\n }\n .zui\\:scale-100 {\n --tw-scale-x: 100% !important;\n --tw-scale-y: 100% !important;\n --tw-scale-z: 100% !important;\n scale: var(--tw-scale-x) var(--tw-scale-y) !important;\n }\n .zui\\:rotate-90 {\n rotate: 90deg !important;\n }\n .zui\\:transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,) !important;\n }\n .zui\\:animate-pulse {\n animation: var(--zui-animate-pulse) !important;\n }\n .zui\\:animate-spin {\n animation: var(--zui-animate-spin) !important;\n }\n .zui\\:cursor-default {\n cursor: default !important;\n }\n .zui\\:cursor-not-allowed {\n cursor: not-allowed !important;\n }\n .zui\\:cursor-pointer {\n cursor: pointer !important;\n }\n .zui\\:resize-none {\n resize: none !important;\n }\n .zui\\:list-inside {\n list-style-position: inside !important;\n }\n .zui\\:list-disc {\n list-style-type: disc !important;\n }\n .zui\\:grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr)) !important;\n }\n .zui\\:grid-cols-12 {\n grid-template-columns: repeat(12, minmax(0, 1fr)) !important;\n }\n .zui\\:flex-col {\n flex-direction: column !important;\n }\n .zui\\:flex-row {\n flex-direction: row !important;\n }\n .zui\\:flex-row-reverse {\n flex-direction: row-reverse !important;\n }\n .zui\\:flex-nowrap {\n flex-wrap: nowrap !important;\n }\n .zui\\:flex-wrap {\n flex-wrap: wrap !important;\n }\n .zui\\:items-baseline {\n align-items: baseline !important;\n }\n .zui\\:items-center {\n align-items: center !important;\n }\n .zui\\:items-start {\n align-items: flex-start !important;\n }\n .zui\\:justify-between {\n justify-content: space-between !important;\n }\n .zui\\:justify-center {\n justify-content: center !important;\n }\n .zui\\:justify-end {\n justify-content: flex-end !important;\n }\n .zui\\:justify-start {\n justify-content: flex-start !important;\n }\n .zui\\:gap-0\\.5 {\n gap: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:gap-1 {\n gap: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:gap-1\\.5 {\n gap: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:gap-2 {\n gap: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:gap-3 {\n gap: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:gap-4 {\n gap: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:gap-6 {\n gap: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 1) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 1) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-2 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 2) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 2) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 3) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 3) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 4) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 4) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 5) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 5) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 6) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 6) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-y-8 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0 !important;\n margin-block-start: calc(calc(var(--zui-spacing) * 8) * var(--tw-space-y-reverse)) !important;\n margin-block-end: calc(calc(var(--zui-spacing) * 8) * calc(1 - var(--tw-space-y-reverse))) !important;\n }\n }\n .zui\\:space-x-1 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 1) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 1) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-2 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 2) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 2) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-3 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 3) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 3) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:space-x-4 {\n :where(& > :not(:last-child)) {\n --tw-space-x-reverse: 0 !important;\n margin-inline-start: calc(calc(var(--zui-spacing) * 4) * var(--tw-space-x-reverse)) !important;\n margin-inline-end: calc(calc(var(--zui-spacing) * 4) * calc(1 - var(--tw-space-x-reverse))) !important;\n }\n }\n .zui\\:gap-y-2 {\n row-gap: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:truncate {\n overflow: hidden !important;\n text-overflow: ellipsis !important;\n white-space: nowrap !important;\n }\n .zui\\:overflow-auto {\n overflow: auto !important;\n }\n .zui\\:overflow-hidden {\n overflow: hidden !important;\n }\n .zui\\:overflow-visible {\n overflow: visible !important;\n }\n .zui\\:overflow-x-auto {\n overflow-x: auto !important;\n }\n .zui\\:overflow-y-auto {\n overflow-y: auto !important;\n }\n .zui\\:rounded {\n border-radius: 0.25rem !important;\n }\n .zui\\:rounded-2xl {\n border-radius: var(--zui-radius-2xl) !important;\n }\n .zui\\:rounded-full {\n border-radius: calc(infinity * 1px) !important;\n }\n .zui\\:rounded-lg {\n border-radius: var(--zui-radius) !important;\n }\n .zui\\:rounded-md {\n border-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-none {\n border-radius: 0 !important;\n }\n .zui\\:rounded-sm {\n border-radius: calc(var(--zui-radius) - 4px) !important;\n }\n .zui\\:rounded-xl {\n border-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:rounded-s-md {\n border-start-start-radius: calc(var(--zui-radius) - 2px) !important;\n border-end-start-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-e-md {\n border-start-end-radius: calc(var(--zui-radius) - 2px) !important;\n border-end-end-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-t-lg {\n border-top-left-radius: var(--zui-radius) !important;\n border-top-right-radius: var(--zui-radius) !important;\n }\n .zui\\:rounded-t-xl {\n border-top-left-radius: calc(var(--zui-radius) + 4px) !important;\n border-top-right-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:rounded-l-md {\n border-top-left-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-r-md {\n border-top-right-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-right-radius: calc(var(--zui-radius) - 2px) !important;\n }\n .zui\\:rounded-b-xl {\n border-bottom-right-radius: calc(var(--zui-radius) + 4px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) + 4px) !important;\n }\n .zui\\:border {\n border-style: var(--tw-border-style) !important;\n border-width: 1px !important;\n }\n .zui\\:border-0 {\n border-style: var(--tw-border-style) !important;\n border-width: 0px !important;\n }\n .zui\\:border-1 {\n border-style: var(--tw-border-style) !important;\n border-width: 1px !important;\n }\n .zui\\:border-2 {\n border-style: var(--tw-border-style) !important;\n border-width: 2px !important;\n }\n .zui\\:border-t {\n border-top-style: var(--tw-border-style) !important;\n border-top-width: 1px !important;\n }\n .zui\\:border-r {\n border-right-style: var(--tw-border-style) !important;\n border-right-width: 1px !important;\n }\n .zui\\:border-b {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 1px !important;\n }\n .zui\\:border-b-0 {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 0px !important;\n }\n .zui\\:border-b-2 {\n border-bottom-style: var(--tw-border-style) !important;\n border-bottom-width: 2px !important;\n }\n .zui\\:border-l-0 {\n border-left-style: var(--tw-border-style) !important;\n border-left-width: 0px !important;\n }\n .zui\\:border-l-4 {\n border-left-style: var(--tw-border-style) !important;\n border-left-width: 4px !important;\n }\n .zui\\:border-blue-100 {\n border-color: var(--zui-color-blue-100) !important;\n }\n .zui\\:border-blue-200 {\n border-color: var(--zui-color-blue-200) !important;\n }\n .zui\\:border-blue-500 {\n border-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:border-blue-600 {\n border-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:border-blue-700 {\n border-color: var(--zui-color-blue-700) !important;\n }\n .zui\\:border-border {\n border-color: var(--zui-border) !important;\n }\n .zui\\:border-current {\n border-color: currentcolor !important;\n }\n .zui\\:border-destructive {\n border-color: var(--zui-destructive) !important;\n }\n .zui\\:border-gray-100 {\n border-color: var(--zui-color-gray-100) !important;\n }\n .zui\\:border-gray-200 {\n border-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:border-gray-300 {\n border-color: var(--zui-color-gray-300) !important;\n }\n .zui\\:border-gray-700 {\n border-color: var(--zui-color-gray-700) !important;\n }\n .zui\\:border-gray-800 {\n border-color: var(--zui-color-gray-800) !important;\n }\n .zui\\:border-green-100 {\n border-color: var(--zui-color-green-100) !important;\n }\n .zui\\:border-green-200 {\n border-color: var(--zui-color-green-200) !important;\n }\n .zui\\:border-green-500 {\n border-color: var(--zui-color-green-500) !important;\n }\n .zui\\:border-green-700 {\n border-color: var(--zui-color-green-700) !important;\n }\n .zui\\:border-input {\n border-color: var(--zui-input) !important;\n }\n .zui\\:border-orange-200 {\n border-color: var(--zui-color-orange-200) !important;\n }\n .zui\\:border-purple-200 {\n border-color: var(--zui-color-purple-200) !important;\n }\n .zui\\:border-purple-500 {\n border-color: var(--zui-color-purple-500) !important;\n }\n .zui\\:border-red-100 {\n border-color: var(--zui-color-red-100) !important;\n }\n .zui\\:border-red-200 {\n border-color: var(--zui-color-red-200) !important;\n }\n .zui\\:border-red-500 {\n border-color: var(--zui-color-red-500) !important;\n }\n .zui\\:border-red-700 {\n border-color: var(--zui-color-red-700) !important;\n }\n .zui\\:border-slate-300 {\n border-color: var(--zui-color-slate-300) !important;\n }\n .zui\\:border-transparent {\n border-color: transparent !important;\n }\n .zui\\:border-yellow-100 {\n border-color: var(--zui-color-yellow-100) !important;\n }\n .zui\\:border-yellow-200 {\n border-color: var(--zui-color-yellow-200) !important;\n }\n .zui\\:border-yellow-600 {\n border-color: var(--zui-color-yellow-600) !important;\n }\n .zui\\:border-yellow-700 {\n border-color: var(--zui-color-yellow-700) !important;\n }\n .zui\\:bg-accent {\n background-color: var(--zui-accent) !important;\n }\n .zui\\:bg-amber-50 {\n background-color: var(--zui-color-amber-50) !important;\n }\n .zui\\:bg-amber-100 {\n background-color: var(--zui-color-amber-100) !important;\n }\n .zui\\:bg-amber-500 {\n background-color: var(--zui-color-amber-500) !important;\n }\n .zui\\:bg-background {\n background-color: var(--zui-background) !important;\n }\n .zui\\:bg-blue-50 {\n background-color: var(--zui-color-blue-50) !important;\n }\n .zui\\:bg-blue-100 {\n background-color: var(--zui-color-blue-100) !important;\n }\n .zui\\:bg-blue-500 {\n background-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:bg-blue-600 {\n background-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:bg-current {\n background-color: currentcolor !important;\n }\n .zui\\:bg-gray-50 {\n background-color: var(--zui-color-gray-50) !important;\n }\n .zui\\:bg-gray-100 {\n background-color: var(--zui-color-gray-100) !important;\n }\n .zui\\:bg-gray-200 {\n background-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:bg-gray-800 {\n background-color: var(--zui-color-gray-800) !important;\n }\n .zui\\:bg-gray-900 {\n background-color: var(--zui-color-gray-900) !important;\n }\n .zui\\:bg-green-50 {\n background-color: var(--zui-color-green-50) !important;\n }\n .zui\\:bg-green-100 {\n background-color: var(--zui-color-green-100) !important;\n }\n .zui\\:bg-green-500 {\n background-color: var(--zui-color-green-500) !important;\n }\n .zui\\:bg-inherit {\n background-color: inherit !important;\n }\n .zui\\:bg-muted {\n background-color: var(--zui-muted) !important;\n }\n .zui\\:bg-neutral-100 {\n background-color: var(--zui-color-neutral-100) !important;\n }\n .zui\\:bg-orange-100 {\n background-color: var(--zui-color-orange-100) !important;\n }\n .zui\\:bg-purple-100 {\n background-color: var(--zui-color-purple-100) !important;\n }\n .zui\\:bg-purple-500 {\n background-color: var(--zui-color-purple-500) !important;\n }\n .zui\\:bg-red-50 {\n background-color: var(--zui-color-red-50) !important;\n }\n .zui\\:bg-red-100 {\n background-color: var(--zui-color-red-100) !important;\n }\n .zui\\:bg-red-500 {\n background-color: var(--zui-color-red-500) !important;\n }\n .zui\\:bg-red-600 {\n background-color: var(--zui-color-red-600) !important;\n }\n .zui\\:bg-secondary {\n background-color: var(--zui-secondary) !important;\n }\n .zui\\:bg-slate-200 {\n background-color: var(--zui-color-slate-200) !important;\n }\n .zui\\:bg-transparent {\n background-color: transparent !important;\n }\n .zui\\:bg-white {\n background-color: var(--zui-color-white) !important;\n }\n .zui\\:bg-white\\/60 {\n background-color: var(--zui-color-white) !important;\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--zui-color-white) 60%, transparent) !important;\n }\n }\n .zui\\:bg-yellow-50 {\n background-color: var(--zui-color-yellow-50) !important;\n }\n .zui\\:bg-yellow-100 {\n background-color: var(--zui-color-yellow-100) !important;\n }\n .zui\\:bg-gradient-to-r {\n --tw-gradient-position: to right in oklab !important;\n background-image: linear-gradient(var(--tw-gradient-stops)) !important;\n }\n .zui\\:from-blue-50 {\n --tw-gradient-from: var(--zui-color-blue-50) !important;\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;\n }\n .zui\\:to-gray-50 {\n --tw-gradient-to: var(--zui-color-gray-50) !important;\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;\n }\n .zui\\:object-cover {\n object-fit: cover !important;\n }\n .zui\\:\\!p-0 {\n padding: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:\\!p-1 {\n padding: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:p-0 {\n padding: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:p-1 {\n padding: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:p-2 {\n padding: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:p-2\\.5 {\n padding: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:p-4 {\n padding: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:p-6 {\n padding: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:px-1 {\n padding-inline: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:px-1\\.5 {\n padding-inline: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:px-2 {\n padding-inline: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:px-2\\.5 {\n padding-inline: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:px-3 {\n padding-inline: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:px-3\\.5 {\n padding-inline: calc(var(--zui-spacing) * 3.5) !important;\n }\n .zui\\:px-4 {\n padding-inline: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:px-5 {\n padding-inline: calc(var(--zui-spacing) * 5) !important;\n }\n .zui\\:px-6 {\n padding-inline: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:px-\\[6px\\] {\n padding-inline: 6px !important;\n }\n .zui\\:py-0 {\n padding-block: calc(var(--zui-spacing) * 0) !important;\n }\n .zui\\:py-0\\.5 {\n padding-block: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:py-1 {\n padding-block: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:py-1\\.5 {\n padding-block: calc(var(--zui-spacing) * 1.5) !important;\n }\n .zui\\:py-2 {\n padding-block: calc(var(--zui-spacing) * 2) !important;\n }\n .zui\\:py-2\\.5 {\n padding-block: calc(var(--zui-spacing) * 2.5) !important;\n }\n .zui\\:py-3 {\n padding-block: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:py-4 {\n padding-block: calc(var(--zui-spacing) * 4) !important;\n }\n .zui\\:py-6 {\n padding-block: calc(var(--zui-spacing) * 6) !important;\n }\n .zui\\:py-10 {\n padding-block: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:py-12 {\n padding-block: calc(var(--zui-spacing) * 12) !important;\n }\n .zui\\:py-16 {\n padding-block: calc(var(--zui-spacing) * 16) !important;\n }\n .zui\\:pt-0\\.5 {\n padding-top: calc(var(--zui-spacing) * 0.5) !important;\n }\n .zui\\:pt-1 {\n padding-top: calc(var(--zui-spacing) * 1) !important;\n }\n .zui\\:pr-3 {\n padding-right: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:pr-8 {\n padding-right: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:pr-9 {\n padding-right: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:pr-10 {\n padding-right: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:pr-11 {\n padding-right: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:pl-3 {\n padding-left: calc(var(--zui-spacing) * 3) !important;\n }\n .zui\\:pl-8 {\n padding-left: calc(var(--zui-spacing) * 8) !important;\n }\n .zui\\:pl-9 {\n padding-left: calc(var(--zui-spacing) * 9) !important;\n }\n .zui\\:pl-10 {\n padding-left: calc(var(--zui-spacing) * 10) !important;\n }\n .zui\\:pl-11 {\n padding-left: calc(var(--zui-spacing) * 11) !important;\n }\n .zui\\:text-center {\n text-align: center !important;\n }\n .zui\\:text-left {\n text-align: left !important;\n }\n .zui\\:text-right {\n text-align: right !important;\n }\n .zui\\:align-middle {\n vertical-align: middle !important;\n }\n .zui\\:font-mono {\n font-family: var(--zui-font-mono) !important;\n }\n .zui\\:\\!text-base {\n font-size: var(--zui-text-base) !important;\n line-height: var(--tw-leading, var(--zui-text-base--line-height)) !important;\n }\n .zui\\:\\!text-sm {\n font-size: var(--zui-text-sm) !important;\n line-height: var(--tw-leading, var(--zui-text-sm--line-height)) !important;\n }\n .zui\\:text-2xl {\n font-size: var(--zui-text-2xl) !important;\n line-height: var(--tw-leading, var(--zui-text-2xl--line-height)) !important;\n }\n .zui\\:text-base {\n font-size: var(--zui-text-base) !important;\n line-height: var(--tw-leading, var(--zui-text-base--line-height)) !important;\n }\n .zui\\:text-lg {\n font-size: var(--zui-text-lg) !important;\n line-height: var(--tw-leading, var(--zui-text-lg--line-height)) !important;\n }\n .zui\\:text-sm {\n font-size: var(--zui-text-sm) !important;\n line-height: var(--tw-leading, var(--zui-text-sm--line-height)) !important;\n }\n .zui\\:text-xl {\n font-size: var(--zui-text-xl) !important;\n line-height: var(--tw-leading, var(--zui-text-xl--line-height)) !important;\n }\n .zui\\:text-xs {\n font-size: var(--zui-text-xs) !important;\n line-height: var(--tw-leading, var(--zui-text-xs--line-height)) !important;\n }\n .zui\\:leading-none {\n --tw-leading: 1 !important;\n line-height: 1 !important;\n }\n .zui\\:leading-snug {\n --tw-leading: var(--zui-leading-snug) !important;\n line-height: var(--zui-leading-snug) !important;\n }\n .zui\\:font-bold {\n --tw-font-weight: var(--zui-font-weight-bold) !important;\n font-weight: var(--zui-font-weight-bold) !important;\n }\n .zui\\:font-medium {\n --tw-font-weight: var(--zui-font-weight-medium) !important;\n font-weight: var(--zui-font-weight-medium) !important;\n }\n .zui\\:font-normal {\n --tw-font-weight: var(--zui-font-weight-normal) !important;\n font-weight: var(--zui-font-weight-normal) !important;\n }\n .zui\\:font-semibold {\n --tw-font-weight: var(--zui-font-weight-semibold) !important;\n font-weight: var(--zui-font-weight-semibold) !important;\n }\n .zui\\:tracking-wide {\n --tw-tracking: var(--zui-tracking-wide) !important;\n letter-spacing: var(--zui-tracking-wide) !important;\n }\n .zui\\:tracking-wider {\n --tw-tracking: var(--zui-tracking-wider) !important;\n letter-spacing: var(--zui-tracking-wider) !important;\n }\n .zui\\:whitespace-nowrap {\n white-space: nowrap !important;\n }\n .zui\\:\\!text-foreground {\n color: var(--zui-foreground) !important;\n }\n .zui\\:text-accent-foreground {\n color: var(--zui-accent-foreground) !important;\n }\n .zui\\:text-amber-600 {\n color: var(--zui-color-amber-600) !important;\n }\n .zui\\:text-amber-700 {\n color: var(--zui-color-amber-700) !important;\n }\n .zui\\:text-blue-500 {\n color: var(--zui-color-blue-500) !important;\n }\n .zui\\:text-blue-600 {\n color: var(--zui-color-blue-600) !important;\n }\n .zui\\:text-blue-700 {\n color: var(--zui-color-blue-700) !important;\n }\n .zui\\:text-blue-800 {\n color: var(--zui-color-blue-800) !important;\n }\n .zui\\:text-blue-900 {\n color: var(--zui-color-blue-900) !important;\n }\n .zui\\:text-destructive {\n color: var(--zui-destructive) !important;\n }\n .zui\\:text-foreground {\n color: var(--zui-foreground) !important;\n }\n .zui\\:text-gray-300 {\n color: var(--zui-color-gray-300) !important;\n }\n .zui\\:text-gray-400 {\n color: var(--zui-color-gray-400) !important;\n }\n .zui\\:text-gray-500 {\n color: var(--zui-color-gray-500) !important;\n }\n .zui\\:text-gray-600 {\n color: var(--zui-color-gray-600) !important;\n }\n .zui\\:text-gray-700 {\n color: var(--zui-color-gray-700) !important;\n }\n .zui\\:text-gray-800 {\n color: var(--zui-color-gray-800) !important;\n }\n .zui\\:text-gray-900 {\n color: var(--zui-color-gray-900) !important;\n }\n .zui\\:text-green-500 {\n color: var(--zui-color-green-500) !important;\n }\n .zui\\:text-green-600 {\n color: var(--zui-color-green-600) !important;\n }\n .zui\\:text-green-700 {\n color: var(--zui-color-green-700) !important;\n }\n .zui\\:text-green-800 {\n color: var(--zui-color-green-800) !important;\n }\n .zui\\:text-green-900 {\n color: var(--zui-color-green-900) !important;\n }\n .zui\\:text-muted-foreground {\n color: var(--zui-muted-foreground) !important;\n }\n .zui\\:text-neutral-400 {\n color: var(--zui-color-neutral-400) !important;\n }\n .zui\\:text-orange-800 {\n color: var(--zui-color-orange-800) !important;\n }\n .zui\\:text-popover-foreground {\n color: var(--zui-popover-foreground) !important;\n }\n .zui\\:text-purple-600 {\n color: var(--zui-color-purple-600) !important;\n }\n .zui\\:text-purple-800 {\n color: var(--zui-color-purple-800) !important;\n }\n .zui\\:text-red-500 {\n color: var(--zui-color-red-500) !important;\n }\n .zui\\:text-red-600 {\n color: var(--zui-color-red-600) !important;\n }\n .zui\\:text-red-700 {\n color: var(--zui-color-red-700) !important;\n }\n .zui\\:text-red-800 {\n color: var(--zui-color-red-800) !important;\n }\n .zui\\:text-red-900 {\n color: var(--zui-color-red-900) !important;\n }\n .zui\\:text-slate-500 {\n color: var(--zui-color-slate-500) !important;\n }\n .zui\\:text-slate-800 {\n color: var(--zui-color-slate-800) !important;\n }\n .zui\\:text-white {\n color: var(--zui-color-white) !important;\n }\n .zui\\:text-yellow-400 {\n color: var(--zui-color-yellow-400) !important;\n }\n .zui\\:text-yellow-600 {\n color: var(--zui-color-yellow-600) !important;\n }\n .zui\\:text-yellow-700 {\n color: var(--zui-color-yellow-700) !important;\n }\n .zui\\:text-yellow-800 {\n color: var(--zui-color-yellow-800) !important;\n }\n .zui\\:text-yellow-900 {\n color: var(--zui-color-yellow-900) !important;\n }\n .zui\\:uppercase {\n text-transform: uppercase !important;\n }\n .zui\\:underline {\n text-decoration-line: underline !important;\n }\n .zui\\:opacity-0 {\n opacity: 0% !important;\n }\n .zui\\:opacity-40 {\n opacity: 40% !important;\n }\n .zui\\:opacity-50 {\n opacity: 50% !important;\n }\n .zui\\:opacity-60 {\n opacity: 60% !important;\n }\n .zui\\:opacity-80 {\n opacity: 80% !important;\n }\n .zui\\:opacity-100 {\n opacity: 100% !important;\n }\n .zui\\:shadow-\\[-2px_0_5px_-2px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: -2px 0 5px -2px var(--tw-shadow-color, rgba(0,0,0,0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-\\[2px_0_5px_-2px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 0 5px -2px var(--tw-shadow-color, rgba(0,0,0,0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:shadow-xs {\n --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05)) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n .zui\\:ring-blue-200 {\n --tw-ring-color: var(--zui-color-blue-200) !important;\n }\n .zui\\:ring-blue-500 {\n --tw-ring-color: var(--zui-color-blue-500) !important;\n }\n .zui\\:ring-blue-600 {\n --tw-ring-color: var(--zui-color-blue-600) !important;\n }\n .zui\\:ring-gray-200 {\n --tw-ring-color: var(--zui-color-gray-200) !important;\n }\n .zui\\:ring-ring {\n --tw-ring-color: var(--zui-ring) !important;\n }\n .zui\\:ring-offset-1 {\n --tw-ring-offset-width: 1px !important;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;\n }\n .zui\\:ring-offset-background {\n --tw-ring-offset-color: var(--zui-background) !important;\n }\n .zui\\:transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-all {\n transition-property: all !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to !important;\n transition-timing-function: var(--tw-ease, var(--zui-default-transition-timing-function)) !important;\n transition-duration: var(--tw-duration, var(--zui-default-transition-duration)) !important;\n }\n .zui\\:transition-none {\n transition-property: none !important;\n }\n .zui\\:duration-150 {\n --tw-duration: 150ms !important;\n transition-duration: 150ms !important;\n }\n .zui\\:duration-200 {\n --tw-duration: 200ms !important;\n transition-duration: 200ms !important;\n }\n .zui\\:duration-300 {\n --tw-duration: 300ms !important;\n transition-duration: 300ms !important;\n }\n .zui\\:duration-500 {\n --tw-duration: 500ms !important;\n transition-duration: 500ms !important;\n }\n .zui\\:ease-in-out {\n --tw-ease: var(--zui-ease-in-out) !important;\n transition-timing-function: var(--zui-ease-in-out) !important;\n }\n .zui\\:ease-out {\n --tw-ease: var(--zui-ease-out) !important;\n transition-timing-function: var(--zui-ease-out) !important;\n }\n .zui\\:outline-none {\n --tw-outline-style: none !important;\n outline-style: none !important;\n }\n .zui\\:select-none {\n -webkit-user-select: none !important;\n user-select: none !important;\n }\n .zui\\:placeholder\\:text-muted-foreground {\n &::placeholder {\n color: var(--zui-muted-foreground) !important;\n }\n }\n .zui\\:focus-within\\:ring-1 {\n &:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n }\n .zui\\:focus-within\\:ring-destructive {\n &:focus-within {\n --tw-ring-color: var(--zui-destructive) !important;\n }\n }\n .zui\\:focus-within\\:ring-ring {\n &:focus-within {\n --tw-ring-color: var(--zui-ring) !important;\n }\n }\n .zui\\:focus-within\\:ring-offset-1 {\n &:focus-within {\n --tw-ring-offset-width: 1px !important;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;\n }\n }\n .zui\\:hover\\:border-gray-400 {\n &:hover {\n @media (hover: hover) {\n border-color: var(--zui-color-gray-400) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-50) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-100 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-100) !important;\n }\n }\n }\n .zui\\:hover\\:bg-gray-200 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-color-gray-200) !important;\n }\n }\n }\n .zui\\:hover\\:text-blue-800 {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-blue-800) !important;\n }\n }\n }\n .zui\\:hover\\:text-red-500 {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-red-500) !important;\n }\n }\n }\n .zui\\:hover\\:underline {\n &:hover {\n @media (hover: hover) {\n text-decoration-line: underline !important;\n }\n }\n }\n .zui\\:hover\\:opacity-100 {\n &:hover {\n @media (hover: hover) {\n opacity: 100% !important;\n }\n }\n }\n .zui\\:focus\\:outline-none {\n &:focus {\n --tw-outline-style: none !important;\n outline-style: none !important;\n }\n }\n .zui\\:disabled\\:cursor-not-allowed {\n &:disabled {\n cursor: not-allowed !important;\n }\n }\n .zui\\:disabled\\:opacity-50 {\n &:disabled {\n opacity: 50% !important;\n }\n }\n .zui\\:aria-selected\\:bg-accent\\/50 {\n &[aria-selected="true"] {\n background-color: var(--zui-accent) !important;\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--zui-accent) 50%, transparent) !important;\n }\n }\n }\n .zui\\:aria-selected\\:text-muted-foreground {\n &[aria-selected="true"] {\n color: var(--zui-muted-foreground) !important;\n }\n }\n .zui\\:aria-selected\\:opacity-30 {\n &[aria-selected="true"] {\n opacity: 30% !important;\n }\n }\n .zui\\:aria-selected\\:opacity-100 {\n &[aria-selected="true"] {\n opacity: 100% !important;\n }\n }\n .zui\\:data-\\[disabled\\]\\:pointer-events-none {\n &[data-disabled] {\n pointer-events: none !important;\n }\n }\n .zui\\:data-\\[disabled\\]\\:opacity-50 {\n &[data-disabled] {\n opacity: 50% !important;\n }\n }\n .zui\\:sm\\:w-auto {\n @media (width >= 40rem) {\n width: auto !important;\n }\n }\n .zui\\:sm\\:rounded-l-md {\n @media (width >= 40rem) {\n border-top-left-radius: calc(var(--zui-radius) - 2px) !important;\n border-bottom-left-radius: calc(var(--zui-radius) - 2px) !important;\n }\n }\n .zui\\:sm\\:rounded-r-xl {\n @media (width >= 40rem) {\n border-top-right-radius: calc(var(--zui-radius) + 4px) !important;\n border-bottom-right-radius: calc(var(--zui-radius) + 4px) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-accent {\n &>button {\n background-color: var(--zui-accent) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-primary {\n &>button {\n background-color: var(--zui-primary) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:bg-transparent {\n &>button {\n background-color: transparent !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:\\!text-foreground {\n &>button {\n color: var(--zui-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-accent-foreground {\n &>button {\n color: var(--zui-accent-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-foreground {\n &>button {\n color: var(--zui-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:text-primary-foreground {\n &>button {\n color: var(--zui-primary-foreground) !important;\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:bg-primary {\n &>button {\n &:hover {\n @media (hover: hover) {\n background-color: var(--zui-primary) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:bg-transparent {\n &>button {\n &:hover {\n @media (hover: hover) {\n background-color: transparent !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:\\!text-foreground {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-foreground) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:text-gray-500 {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-color-gray-500) !important;\n }\n }\n }\n }\n .zui\\:\\[\\&\\>button\\]\\:hover\\:text-primary-foreground {\n &>button {\n &:hover {\n @media (hover: hover) {\n color: var(--zui-primary-foreground) !important;\n }\n }\n }\n }\n}\n:root {\n --zui-radius: 0.625rem;\n --zui-background: oklch(1 0 0);\n --zui-foreground: oklch(0.145 0 0);\n --zui-card: oklch(1 0 0);\n --zui-card-foreground: oklch(0.145 0 0);\n --zui-popover: oklch(1 0 0);\n --zui-popover-foreground: oklch(0.145 0 0);\n --zui-primary: oklch(0.55 0.247 266.93);\n --zui-primary-foreground: oklch(0.985 0 0);\n --zui-secondary: oklch(0.97 0 0);\n --zui-secondary-foreground: oklch(0.205 0 0);\n --zui-muted: oklch(0.97 0 0);\n --zui-muted-foreground: oklch(0.556 0 0);\n --zui-accent: oklch(0.97 0 0);\n --zui-accent-foreground: oklch(0.205 0 0);\n --zui-destructive: oklch(0.577 0.245 27.325);\n --zui-border: oklch(0.922 0 0);\n --zui-input: oklch(0.922 0 0);\n --zui-ring: oklch(0.708 0 0);\n --zui-chart-1: oklch(0.646 0.222 41.116);\n --zui-chart-2: oklch(0.6 0.118 184.704);\n --zui-chart-3: oklch(0.398 0.07 227.392);\n --zui-chart-4: oklch(0.828 0.189 84.429);\n --zui-chart-5: oklch(0.769 0.188 70.08);\n --zui-sidebar: oklch(0.985 0 0);\n --zui-sidebar-foreground: oklch(0.145 0 0);\n --zui-sidebar-primary: oklch(0.205 0 0);\n --zui-sidebar-primary-foreground: oklch(0.985 0 0);\n --zui-sidebar-accent: oklch(0.97 0 0);\n --zui-sidebar-accent-foreground: oklch(0.205 0 0);\n --zui-sidebar-border: oklch(0.922 0 0);\n --zui-sidebar-ring: oklch(0.708 0 0);\n}\n@property --tw-border-spacing-x {\n syntax: "<length>";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-spacing-y {\n syntax: "<length>";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-x {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-space-y-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-space-x-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: "*";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: "*";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: "*";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: "<length>";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: "*";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-duration {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ease {\n syntax: "*";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-space-x-reverse: 0;\n --tw-border-style: solid;\n --tw-gradient-position: initial;\n --tw-gradient-from: #0000;\n --tw-gradient-via: #0000;\n --tw-gradient-to: #0000;\n --tw-gradient-stops: initial;\n --tw-gradient-via-stops: initial;\n --tw-gradient-from-position: 0%;\n --tw-gradient-via-position: 50%;\n --tw-gradient-to-position: 100%;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n');var m=function(n){var t=n.open,c=n.onClose,u=n.title,m=n.children,d=n.footer,z=n.side,g=void 0===z?"right":z,v=n.className,h=n.showCloseIcon,w=void 0===h||h,b=n.withOverlay,x=void 0===b||b,f=n.stickyFooter,y=void 0===f||f,k=n.width,j=n.height,C="left"===g||"right"===g;return r(a,{anchor:g,open:t,onClose:c,ModalProps:{keepMounted:!0},hideBackdrop:!x,PaperProps:{style:{width:C?null!=k?k:400:void 0,height:C?"100%":null!=j?j:400},className:p("zui:bg-background zui:shadow-lg zui:border-border zui:flex zui:flex-col",C?"zui:h-full zui:rounded-none zui:sm:rounded-l-md":"zui:w-full zui:sm:w-auto","left"===g&&"zui:sm:rounded-r-xl zui:border-r zui:border-l-0","top"===g&&"zui:rounded-b-xl","bottom"===g&&"zui:rounded-t-xl",v)},children:[r(e,{className:"zui:p-4 zui:flex zui:items-center zui:justify-between zui:border-b zui:border-border",children:[o(i,{size:"sm",fontWeight:600,children:u}),w&&o(l,{onClick:c,size:"small",className:"zui:hover:text-red-500",children:o(s,{className:"zui:h-4 zui:w-4"})})]}),o(e,{className:"zui:flex-1 zui:overflow-y-auto zui:p-4",children:m}),d&&o(e,{className:p("zui:border-t zui:border-border zui:p-2",y&&"zui:sticky zui:bottom-0 zui:bg-background"),children:d})]})};export{m as Drawer,i as Text,p as cn};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zimyo/ui",
3
- "version": "1.10.3",
3
+ "version": "1.10.4",
4
4
  "description": "Zimyo UI library built on MUI Material",
5
5
  "type": "module",
6
6
  "module": "dist/index.esm.js",