@nexusui/components
Version:
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.
3 lines (2 loc) • 1.31 kB
JavaScript
"use client";
import{jsx as e}from"react/jsx-runtime";import{useState as t,useRef as n,useEffect as o}from"react";import i from"lodash/debounce";import{EventLogComponent as r}from"./EventLog.component.js";import{useTranslate as a}from"../locales/index.js";import s from"./locale.json.js";const g=g=>{const{infiniteLoad:l=!1,events:c=[],onFetchData:m,loading:d,total:p=0,initialPage:h=0,initialPageSize:f=50,initialFilter:u,itemHeight:v=117,onPageChange:E,onPageSizeChange:L,onFilterChange:P,...w}=g,[z,C]=t(h),[j,x]=t(0),[F,S]=t(f),[N,D]=t(u),H=n(!1),I=n(l),b=a(s),M=d?()=>{}:()=>{const e=z+1;C(e),m(e,F,N)};o((()=>{H.current||(H.current=!0,m(z,F))}),[z,F,m]),o((()=>{if(I.current!==l&&"production"!==process.env.NODE_ENV)throw Error('EventLog: "infiniteLoad" props does not allow changes at runtime')}),[l]),o((()=>{const e=i((()=>{x(j+1)}),200);return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[j]);const O=c.length<p;return e(r,{infiniteLoad:l,itemHeight:v,page:z,pageSize:F,filter:N,total:p,events:c,loading:d,hasNextPage:O,onPageChange:(e,t)=>{C(t),E&&E(t),m(t,F,N)},onPageSizeChange:e=>{const t=parseInt(e.target.value,10);C(0),S(t),E&&E(0),L&&L(t),m(0,t,N)},onFilterChange:e=>{C(0),D(e),E&&E(0),P&&P(e),m(0,F,e)},loadMoreItems:M,t:b,...w},j)};export{g as EventLog};