koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
3 lines (2 loc) • 8 kB
JavaScript
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),E=require("classnames"),r=require("@tanstack/react-table"),Ie=require("css-vars-hook"),Me=require("../../internal/hooks/useResizeObserverNew.cjs"),Fe=require("../../internal/hooks/useInternalRef.cjs"),Te=require("../../internal/locale/useBrowserLocale.cjs");;/* empty css */const Ne=require("../../internal/hooks/useInternalId.cjs"),ve=require("../../internal/Icons/IconFilterOff.cjs"),He=require("./tableFeatures/useColumnFilters.cjs"),a=require("./DataTable.module.css.cjs"),i=require("./types.cjs"),Ae=require("./tableFeatures/useColumnPinning.cjs"),C=require("./TableCell.cjs"),Ee=require("./tableFeatures/useVirtualRows.cjs"),ye=require("./tableFeatures/useTableData.cjs"),Le=require("./Pagination.cjs"),ze=require("./tableFeatures/usePagination.cjs"),Oe=require("./tableFeatures/useSorting.cjs"),ke=require("./dialogs/FilterDialog.cjs"),Be=require("./tableFeatures/useRowSelection.cjs"),Ve=require("./tableFeatures/useTableHeight.cjs"),$e=require("./dialogs/DeleteDialog.cjs"),We=require("./dialogs/EditDialog.cjs"),_e=require("./SelectableActions.cjs"),Ge=require("./tableFeatures/useEdit.cjs"),Je=require("./tableFeatures/useTableColumns.cjs"),y=require("./filterFns.cjs"),Ke=require("../Text/Table.cjs"),Qe=require("../Button/Button.cjs"),Ue=require("../Text/InlineElements.cjs"),L=42,Xe=6,Ye={pageIndex:0,pageSize:10},Ze=[],et=[],tt={},z=g.forwardRef(({children:nt,className:O,tableData:k=[],columnPinning:B,renderMode:u=i.RenderModes.virtual,pagination:V=Ye,onPaginationChange:$=()=>{},onSortingChange:W=()=>{},onFiltersChange:_=()=>{},onRowSelect:G=()=>{},onEdit:J=()=>{},rowSelection:K=tt,pageCount:Q,sorting:U=Ze,processingMode:h=i.ProcessingModes.internal,columnFilters:X=et,locale:Y,selectable:x=!1,tableHeight:Z="full",caption:R,columns:ee=[],id:te,...ne},le)=>{var v,H,A;const m=Ne.useInternalId(te),{tableData:p,setTableData:oe}=ye.useTableData(k),q=Fe.useInternalRef(le),w=g.useRef(null),{height:P}=Me.useResizeObserver(q),{LocalRoot:se}=Ie.useLocalTheme(),D=Ve.useTableHeight({tableHeightProp:Z}),ie=g.useMemo(()=>({...P&&{"table-height":P},"cell-height":L,"max-height":D}),[D,P]),{columnPinning:ae,setColumnPinning:re}=Ae.useColumnPinning({columnPinningProp:B,hasSelectableColumn:x}),{pagination:I,setPagination:ce,currentPage:ue,setCurrentPage:de,setPageSize:ge}=ze.usePagination({paginationProp:V,onPaginationChange:$}),{sorting:he,setSorting:me}=Oe.useSorting({sortingProp:U,onSortingChange:W}),{columnFilters:S,setColumnFilters:fe}=He.useColumnFilters({columnFiltersProp:X,onFiltersChange:_}),xe=Te.useBrowserLocale(),{rowSelection:f,setRowSelection:Re,clearSelection:M}=Be.useRowSelection({rowSelectionProp:K,onRowSelect:G,processingMode:h}),{columns:j,editableColumns:be}=Je.useTableColumns({columnsProp:ee,selectable:x}),l=r.useReactTable({meta:{locale:Y||xe,editModalId:`edit-modal-${m}`,filterModalId:`filter-modal-${m}`,deleteModalId:`delete-modal-${m}`},data:p,columns:j,getCoreRowModel:r.getCoreRowModel(),onColumnPinningChange:re,getPaginationRowModel:u===i.RenderModes.paginated?r.getPaginationRowModel():void 0,onPaginationChange:u===i.RenderModes.paginated?ce:void 0,state:{pagination:u===i.RenderModes.paginated?I:void 0,columnPinning:ae,sorting:he,columnFilters:S,rowSelection:f},manualPagination:h===i.ProcessingModes.external,pageCount:h===i.ProcessingModes.external?Q:void 0,getSortedRowModel:r.getSortedRowModel(),onSortingChange:me,enableMultiSort:!1,manualSorting:h===i.ProcessingModes.external,getFilteredRowModel:r.getFilteredRowModel(),onColumnFiltersChange:fe,manualFiltering:h===i.ProcessingModes.external,enableRowSelection:!0,onRowSelectionChange:Re,filterFns:{isInDateRange:y.isInDateRange,isInPercentRange:y.isInPercentRange}}),{rows:b}=l.getRowModel(),{before:F,after:T,virtualRows:Ce}=Ee.useVirtualRows({rowsCount:b.length,scrollRef:w,overscan:Xe,cellHeight:L}),pe=g.useCallback(({filter:o,column:t})=>{var n;(n=l.getColumn(t))==null||n.setFilterValue(o)},[l]),Pe=g.useCallback(()=>{l.resetColumnFilters()},[l]),{handleEdit:Se,handleDelete:je,handleDeleteRequest:qe,handleEditRequest:we}=Ge.useEdit({rowSelection:f,onEdit:J,clearSelection:M,setTableData:oe,table:l,tableData:p,processingMode:h}),N=`caption-${m}`;return e.jsxs(g.Fragment,{children:[e.jsx(ke.FilterDialog,{tableContext:l,id:(v=l.options.meta)==null?void 0:v.filterModalId,onApplyFiler:pe,columnFilters:S}),e.jsx(We.EditDialog,{id:(H=l.options.meta)==null?void 0:H.editModalId,selectionAmount:Object.keys(f).length,columnsConfig:be,onEdit:Se}),e.jsx($e.DeleteDialog,{id:(A=l.options.meta)==null?void 0:A.deleteModalId,selectionAmount:Object.keys(f).length,onDeleteConfirmation:je}),e.jsxs(se,{theme:ie,className:a.default.heightContainer,children:[x&&e.jsx(_e.SelectableActions,{selectedRows:Object.keys(f).length,totalRows:l.getPreFilteredRowModel().rows.length,onDeleteRequest:qe,onEditRequest:we,onClear:M}),e.jsxs(Ke.Table,{"aria-describedby":R&&N,wrapperRef:w,wrapperClassName:E(a.default.tableWrapper,{[a.default.paginated]:u===i.RenderModes.paginated,[a.default.selectable]:x,[a.default.hasCaption]:!!R}),...ne,id:m,className:E(a.default.dataTable,O),ref:q,children:[e.jsx("thead",{className:a.default.tableHeader,children:l.getHeaderGroups().map(o=>e.jsx("tr",{children:o.headers.map((t,n,s)=>{const c=n>0?n+1:0,d=n===s.length?0:s.length-(n+1);return e.jsx(C.TableCell,{as:"th",leftMargin:t.column.getStart("left")+c,rightMargin:t.column.getAfter("right")+d,isPinned:t.column.getIsPinned(),children:t.isPlaceholder?null:r.flexRender(t.column.columnDef.header,t.getContext())},t.id)})},o.id))}),u===i.RenderModes.virtual&&e.jsx("tbody",{children:e.jsxs(g.Fragment,{children:[F>0&&e.jsx("tr",{children:e.jsx("td",{colSpan:j.length,style:{height:F}})}),Ce.map(o=>{const t=b[o.index];return e.jsx("tr",{style:{height:`${o.size}px`},children:t.getVisibleCells().map((n,s,c)=>{const d=s>0?s+1:0,De=s===c.length?0:c.length-(s+1);return e.jsx(C.TableCell,{isHighlighted:!!n.column.getIsSorted(),as:"td",leftMargin:n.column.getStart("left")+d,rightMargin:n.column.getAfter("right")+De,isPinned:n.column.getIsPinned(),children:r.flexRender(n.column.columnDef.cell,n.getContext())},n.id)})},t.id)}),T>0&&e.jsx("tr",{children:e.jsx("td",{colSpan:j.length,style:{height:T}})})]})}),u===i.RenderModes.paginated&&e.jsx("tbody",{children:b.map(o=>e.jsx("tr",{children:o.getVisibleCells().map((t,n,s)=>{const c=n>0?n+1:0,d=n===s.length?0:s.length-(n+1);return e.jsx(C.TableCell,{isHighlighted:!!t.column.getIsSorted(),as:"td",leftMargin:t.column.getStart("left")+c,rightMargin:t.column.getAfter("right")+d,isPinned:t.column.getIsPinned(),children:r.flexRender(t.column.columnDef.cell,t.getContext())},t.id)})},o.id))}),b.length===0&&e.jsx("tbody",{children:e.jsx("tr",{className:a.default.noDataRow,children:e.jsx("td",{className:a.default.noDataCell,colSpan:l.getAllColumns().length,children:e.jsxs("div",{className:a.default.noDataWarning,children:[e.jsx("span",{children:"No data to render."}),S.length>0&&e.jsx(Qe.Button,{onClick:Pe,prefix:ve.IconFilterOff,size:"small",variant:"link",children:"Reset all filters"})]})})})}),e.jsx("tfoot",{className:a.default.tableFooter,children:l.getFooterGroups().map(o=>e.jsx("tr",{children:o.headers.map((t,n,s)=>{const c=n>0?n+1:0,d=n===s.length?0:s.length-(n+1);return e.jsx(C.TableCell,{as:"th",leftMargin:t.column.getStart("left")+c,rightMargin:t.column.getAfter("right")+d,isPinned:t.column.getIsPinned(),children:t.isPlaceholder?null:r.flexRender(t.column.columnDef.footer,t.getContext())},t.id)})},o.id))})]}),u===i.RenderModes.paginated&&e.jsx(Le.Pagination,{rowsCount:p.length,onPageSizeChange:ge,currentPage:ue,pagesAmount:l.getPageCount(),pageSize:I.pageSize,setCurrentPage:de}),R&&e.jsx("div",{id:N,className:a.default.tableCaption,children:e.jsx(Ue.I,{children:R})})]})]})});z.displayName="DataTable";exports.DataTable=z;
//# sourceMappingURL=DataTable.cjs.map