@nexusui/components/cjs/core/EventLog/EventLog.component.js

These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("react-window"),a=require("react-window-infinite-loader"),r=require("react-virtualized-auto-sizer"),n=require("@mui/material/styles"),l=require("@mui/material/Box"),s=require("@mui/material/Stack"),o=require("@mui/material/TablePagination"),d=require("@mui/material/CircularProgress"),u=require("@mui/material/useMediaQuery"),h=require("clsx"),g=require("./components/EventItem.js"),c=require("./components/NoEvents.js"),m=require("./EventLog.styles.js"),f=require("./components/EventFilter.js"),x=require("../util/hooks/useRowChanged.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var w=j(a),v=j(r),p=j(l),q=j(s),C=j(o),P=j(d),z=j(u),I=j(h);const R="NexusEventLog";exports.EventLogComponent=a=>{const{infiniteLoad:r,loading:l,total:s,events:o,page:d,pageSize:u,filter:h,filterOptions:j,onPageChange:b,onPageSizeChange:L,onFilterChange:N,hasNextPage:y,loadMoreItems:S,itemHeight:$,sx:E,paginationProps:k,ItemComponent:M=g.EventItem,FilterComponent:A=f.default,t:F,...O}=a,D=e=>!y||e<o.length,H=t.useRef(null),T=t.useRef({}),V=n.useTheme(),_=z.default(V.breakpoints.down(350)),B=e=>T.current[e]||$,Q=t.useCallback(((e,t)=>{H?.current?.resetAfterIndex&&H.current.resetAfterIndex(0),T.current={...T.current,[e]:t}}),[]),W=({index:t,style:i})=>{const{rowRef:a}=x.useRowChanged({index:t,setRowHeight:Q});let r;return delete i.height,r=D(t)?e.jsx(M,{...o[t],isMinWidth:_}):F("Loading"),e.jsx(p.default,{ref:a,style:i,className:I.default(`${R}-item`,"event-log-item"),children:r})};return e.jsxs(q.default,{className:`${R}-root`,sx:[m.default.eventList,...Array.isArray(E)?E:[E]],...O,children:[j&&e.jsx(A,{filter:h,t:F,filterOptions:j,onFilterChange:N}),r&&e.jsx(p.default,{sx:{height:"100%"},children:e.jsx(v.default,{children:({height:t,width:a})=>0===d&&l?e.jsx(p.default,{className:I.default(`${R}-loading`,"event-log-loading"),sx:{height:t,width:a},children:e.jsx(P.default,{size:104,thickness:2,"aria-label":"Loading indicator"})}):0===o.length?e.jsx(p.default,{className:I.default(`${R}-loading`,"event-log-loading"),sx:{height:t,width:a},children:e.jsx(c.default,{t:F})}):e.jsx(w.default,{isItemLoaded:D,itemCount:y?o.length+1:o.length,loadMoreItems:S,children:({onItemsRendered:r,ref:n})=>e.jsx(i.VariableSizeList,{ref:e=>{n?.(e),H.current=e},className:I.default(`${R}-list`,"event-log-list"),itemData:o,height:t,itemCount:y?o.length+1:o.length,itemSize:B,estimatedItemSize:$,onItemsRendered:r,width:a,children:W})})})}),!r&&e.jsx(p.default,{sx:{height:"100%"},children:e.jsx(v.default,{children:({height:t,width:a})=>e.jsxs(q.default,{children:[l&&e.jsx(p.default,{className:I.default(`${R}-loading`,"event-log-loading"),sx:{height:t-48,width:a},children:e.jsx(P.default,{size:104,thickness:2,"aria-label":"Loading indicator"})}),!l&&0===o.length&&e.jsx(p.default,{className:I.default(`${R}-loading`,"event-log-loading"),sx:{height:t-48,width:a},children:e.jsx(c.default,{t:F})}),!l&&o.length>0&&e.jsx(i.VariableSizeList,{ref:H,className:I.default(`${R}-list`,"event-log-list"),itemData:o,height:t-48,itemCount:o.length,itemSize:B,estimatedItemSize:$,width:a,children:W}),e.jsx(C.default,{...k,labelRowsPerPage:_?F("Rows:"):k?.labelRowsPerPage,sx:{...m.paginationStyle(a),...k?.sx},component:"div",count:s,page:d,rowsPerPage:u,onPageChange:b,onRowsPerPageChange:L})]})})})]})};