@primereact/mcp 11.0.0 → 11.2.0

package/data/llms/styled/components/treetable.md

@@ -13,6 +13,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -26,7 +27,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -123,7 +126,7 @@ export default function Preview() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -234,6 +237,7 @@ import { ChevronDown } from '@primeicons/react/chevron-down';
 import { ChevronRight } from '@primeicons/react/chevron-right';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import * as React from 'react';
 
 interface TreeNode {
@@ -297,7 +301,7 @@ export default function BasicDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -340,6 +344,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import { ToggleButton } from '@primereact/ui/togglebutton';
 import { ToggleButtonGroup } from '@primereact/ui/togglebuttongroup';
@@ -355,7 +360,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -462,7 +469,7 @@ export default function TreeTableSizeDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -528,6 +535,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -541,7 +549,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -625,7 +635,7 @@ export default function TreeTableGridlinesDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -691,6 +701,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -704,7 +715,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -788,7 +801,7 @@ export default function TreeTableStripedRowsDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -853,6 +866,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent, DataTableSelectionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -875,7 +889,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -918,7 +934,7 @@ export default function SingleSelectionDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -981,6 +997,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent, DataTableSelectionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -1003,7 +1020,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1047,7 +1066,7 @@ export default function MultipleSelectionDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -1118,6 +1137,7 @@ import type { CheckboxRootChangeEvent } from '@primereact/ui/checkbox';
 import type { DataTableSelectionInstance } from '@primereact/ui/datatable';
 import { Checkbox } from '@primereact/ui/checkbox';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -1131,7 +1151,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1258,7 +1280,7 @@ export default function TreeTableSelectionDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody key={JSON.stringify(selectionKeys)}>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -1339,6 +1361,7 @@ import type { DataTableExpansionEvent, DataTableSelectionEvent } from '@primerea
 import type { DataTableSelectionInstance } from '@primereact/ui/datatable';
 import type { RadioButtonRootChangeEvent } from '@primereact/ui/radiobutton';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { RadioButton } from '@primereact/ui/radiobutton';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -1362,7 +1385,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1406,7 +1431,7 @@ export default function RadioSelectionDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <DataTable.Selection mode="radio">
@@ -1484,6 +1509,7 @@ import { NodeService, type TreeTableNode } from '@/shared/services/node.service'
 import type { DataTableExpansionEvent, DataTableSelectionEvent } from '@primereact/ui/datatable';
 import { Badge } from '@primereact/ui/badge';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -1506,7 +1532,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1565,7 +1593,7 @@ export default function KeyboardDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -1635,6 +1663,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableSortOrderInstance } from '@primereact/ui/datatable';
 import { Badge } from '@primereact/ui/badge';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { OverlayBadge } from '@primereact/ui/overlaybadge';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -1658,7 +1687,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1730,7 +1761,7 @@ export default function SortDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -1796,6 +1827,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableSortOrderInstance } from '@primereact/ui/datatable';
 import { Badge } from '@primereact/ui/badge';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { OverlayBadge } from '@primereact/ui/overlaybadge';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -1819,7 +1851,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -1891,7 +1925,7 @@ export default function MultiSortDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -1955,6 +1989,7 @@ import { SortAmountUpAlt } from '@primeicons/react/sort-amount-up-alt';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -1977,7 +2012,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2052,7 +2089,7 @@ export default function PresortDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2116,6 +2153,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableSortOrderInstance } from '@primereact/ui/datatable';
 import { Badge } from '@primereact/ui/badge';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { OverlayBadge } from '@primereact/ui/overlaybadge';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -2139,7 +2177,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2243,7 +2283,7 @@ export default function PresortMultiDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2313,6 +2353,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { PaginatorRootChangeEvent } from '@primereact/ui/paginator';
 import type { DataTablePaginationInstance } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Paginator } from '@primereact/ui/paginator';
 import { Tag } from '@primereact/ui/tag';
 import type { PaginatorPagesInstance } from '@primereact/ui/paginator';
@@ -2337,7 +2378,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2378,7 +2421,7 @@ export default function PaginationDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2487,6 +2530,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -2510,7 +2554,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2566,7 +2612,7 @@ export default function TreeTableScrollDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2627,6 +2673,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -2649,7 +2696,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2699,7 +2748,7 @@ export default function ScrollHorizontalDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2765,6 +2814,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -2787,7 +2837,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2828,7 +2880,7 @@ export default function ScrollFlexDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -2894,6 +2946,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -2913,7 +2966,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -2987,7 +3042,7 @@ export default function TreeTableFrozenColumnsDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell frozen>
                                         <div className="flex items-center gap-2">
@@ -3053,6 +3108,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -3075,7 +3131,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -3125,7 +3183,7 @@ export default function ScrollFrozenColumnsMultiDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell frozen>
                                         <div className="flex items-center gap-2">
@@ -3196,6 +3254,7 @@ import { LockOpen } from '@primeicons/react/lock-open';
 import { Video } from '@primeicons/react/video';
 import { Button } from '@primereact/ui/button';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -3215,7 +3274,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -3279,7 +3340,7 @@ export default function TreeTableFrozenRowsDemo() {
         </DataTable.Row>
     );
 
-    const renderBodyRow = (item: any) => (
+    const renderBodyRow = (item: DataTableTreeRow<TreeNode>) => (
         <DataTable.Row key={String(item.key)}>
             <DataTable.Cell>
                 <div className="flex items-center gap-2">
@@ -3333,7 +3394,7 @@ export default function TreeTableFrozenRowsDemo() {
                         <DataTable.FrozenTBody>
                             {lockedFolders.flatMap((folder) => flattenBranch(folder).map((node) => renderFrozenRow(node)))}
                         </DataTable.FrozenTBody>
-                        <DataTable.TBody>{({ item }: { item: any }) => renderBodyRow(item)}</DataTable.TBody>
+                        <DataTable.TBody>{({ item }: { item: DataTableTreeRow<TreeNode> }) => renderBodyRow(item)}</DataTable.TBody>
                         <DataTable.EmptyTBody>
                             <DataTable.Row>
                                 <DataTable.Cell colSpan={4}>
@@ -3377,6 +3438,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { InputText } from '@primereact/ui/inputtext';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -3391,7 +3453,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -3498,7 +3562,7 @@ export default function TreeTableCellEditDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item, index }: { item: any; index: number }) => (
+                            {({ item, index }: { item: DataTableTreeRow<TreeNode>; index: number }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -3516,7 +3580,7 @@ export default function TreeTableCellEditDemo() {
                                                 <DataTable.CellEditorContent>
                                                     <InputText
                                                         defaultValue={String(item.name)}
-                                                        onChange={(e: any) => {
+                                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                             pendingValueRef.current[`${item.key}-name`] = e.target.value;
                                                         }}
                                                         size="small"
@@ -3532,7 +3596,7 @@ export default function TreeTableCellEditDemo() {
                                             <DataTable.CellEditorContent>
                                                 <InputText
                                                     defaultValue={String(item.size)}
-                                                    onChange={(e: any) => {
+                                                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                         pendingValueRef.current[`${item.key}-size`] = e.target.value;
                                                     }}
                                                     size="small"
@@ -3549,7 +3613,7 @@ export default function TreeTableCellEditDemo() {
                                             <DataTable.CellEditorContent>
                                                 <InputText
                                                     defaultValue={String(item.type)}
-                                                    onChange={(e: any) => {
+                                                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                         pendingValueRef.current[`${item.key}-type`] = e.target.value;
                                                     }}
                                                     size="small"
@@ -3603,6 +3667,7 @@ import type { DataTableSelectionInstance } from '@primereact/ui/datatable';
 import { Badge } from '@primereact/ui/badge';
 import { Checkbox } from '@primereact/ui/checkbox';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { InputText } from '@primereact/ui/inputtext';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -3626,7 +3691,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -3722,7 +3789,7 @@ export default function CellEditSelectionDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item, index }: { item: any; index: number }) => (
+                            {({ item, index }: { item: DataTableTreeRow<TreeTableNode>; index: number }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <DataTable.Selection>
@@ -3760,7 +3827,7 @@ export default function CellEditSelectionDemo() {
                                                 <DataTable.CellEditorContent>
                                                     <InputText
                                                         defaultValue={String(item.name)}
-                                                        onChange={(e: any) => {
+                                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                             pendingValueRef.current[`${item.key}-name`] = e.target.value;
                                                         }}
                                                         size="small"
@@ -3778,7 +3845,7 @@ export default function CellEditSelectionDemo() {
                                             <DataTable.CellEditorContent>
                                                 <InputText
                                                     defaultValue={String(item.size)}
-                                                    onChange={(e: any) => {
+                                                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                         pendingValueRef.current[`${item.key}-size`] = e.target.value;
                                                     }}
                                                     size="small"
@@ -3836,9 +3903,11 @@ import { Times } from '@primeicons/react/times';
 import type { DataTableExpansionEvent, DataTableRowEditEvent } from '@primereact/ui/datatable';
 import { Button } from '@primereact/ui/button';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { InputText } from '@primereact/ui/inputtext';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
+import type { DataTableEditingEvent } from '@primereact/ui/datatable';
 
 const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> = {
     Folder: 'warn',
@@ -3849,7 +3918,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -3945,7 +4016,7 @@ export default function TreeTableRowEditDemo() {
                 onExpandedChange={(e: DataTableExpansionEvent) => setExpandedKeys(e.value)}
                 editMode="row"
                 editingKeys={editingKeys}
-                onEditingKeysChange={(e: any) => setEditingKeys(e.value)}
+                onEditingKeysChange={(e: DataTableEditingEvent) => setEditingKeys(e.value)}
                 onRowEditSave={handleSave}
                 onRowEditCancel={handleCancel}
             >
@@ -3968,7 +4039,7 @@ export default function TreeTableRowEditDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item, index }: { item: any; index: number }) => {
+                            {({ item, index }: { item: DataTableTreeRow<TreeNode>; index: number }) => {
                                 const key = String(item.key);
 
                                 return (
@@ -3990,7 +4061,7 @@ export default function TreeTableRowEditDemo() {
                                                         <DataTable.CellEditorContent>
                                                             <InputText
                                                                 defaultValue={String(item.name)}
-                                                                onChange={(e: any) => {
+                                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                                     draftRef.current[key] = { ...draftRef.current[key], name: e.target.value };
                                                                 }}
                                                                 size="small"
@@ -4006,7 +4077,7 @@ export default function TreeTableRowEditDemo() {
                                                     <DataTable.CellEditorContent>
                                                         <InputText
                                                             defaultValue={String(item.size)}
-                                                            onChange={(e: any) => {
+                                                            onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                                 draftRef.current[key] = { ...draftRef.current[key], size: e.target.value };
                                                             }}
                                                             size="small"
@@ -4023,7 +4094,7 @@ export default function TreeTableRowEditDemo() {
                                                     <DataTable.CellEditorContent>
                                                         <InputText
                                                             defaultValue={String(item.type)}
-                                                            onChange={(e: any) => {
+                                                            onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                                 draftRef.current[key] = { ...draftRef.current[key], type: e.target.value };
                                                             }}
                                                             size="small"
@@ -4090,6 +4161,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -4112,7 +4184,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -4158,7 +4232,7 @@ export default function ResizeDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -4219,6 +4293,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -4241,7 +4316,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -4288,7 +4365,7 @@ export default function ResizeExpandDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -4358,6 +4435,7 @@ import { Image as ImageIcon } from '@primeicons/react/image';
 import { Video } from '@primeicons/react/video';
 import type { DataTableColumnReorderEvent, DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -4376,7 +4454,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -4393,7 +4473,7 @@ const initialColumns: Column[] = [
     { field: 'type', header: 'Type' }
 ];
 
-function renderCell(field: Column['field'], item: any) {
+function renderCell(field: Column['field'], item: DataTableTreeRow<TreeTableNode>) {
     if (field === 'name') {
         return (
             <div className="flex items-center gap-2">
@@ -4461,7 +4541,7 @@ export default function ReorderDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody key={columns.map((c) => c.field).join(',')}>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     {columns.map((col) => (
                                         <DataTable.Cell key={col.field}>{renderCell(col.field, item)}</DataTable.Cell>
@@ -4514,6 +4594,7 @@ import { ChevronRight } from '@primeicons/react/chevron-right';
 import { NodeService, type TreeTableNode } from '@/shared/services/node.service';
 import type { DataTableExpansionEvent, DataTableRowReorderEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -4536,7 +4617,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -4556,6 +4639,7 @@ export default function RowReorderDemo() {
         const toNode = flat[e.dropIndex];
 
         if (!fromNode || !toNode) return;
+
         if ((fromNode._treeLevel ?? 0) !== 0 || (toNode._treeLevel ?? 0) !== 0) return;
 
         setNodes((prev) => {
@@ -4604,7 +4688,7 @@ export default function RowReorderDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item, index }: { item: any; index: number }) => (
+                            {({ item, index }: { item: DataTableTreeRow<TreeTableNode>; index: number }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         {Number(item._treeLevel ?? 0) === 0 ? (
@@ -4681,6 +4765,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { Button } from '@primereact/ui/button';
 import { Checkbox } from '@primereact/ui/checkbox';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Popover } from '@primereact/ui/popover';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
@@ -4704,7 +4789,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -4726,7 +4813,7 @@ const initialColumns: ColumnDef[] = [
 
 const defaultVisibleFields: ColumnDef['field'][] = ['name', 'size', 'type'];
 
-function renderCell(field: ColumnDef['field'], item: any) {
+function renderCell(field: ColumnDef['field'], item: DataTableTreeRow<TreeTableNode>) {
     if (field === 'name') {
         return (
             <div className="flex items-center gap-2">
@@ -4787,6 +4874,7 @@ function ColumnsPopover({
 
         if (set.has(field)) set.delete(field);
         else set.add(field);
+
         onVisibleFieldsChange(Array.from(set));
     };
 
@@ -4895,7 +4983,7 @@ export default function ColumnToggleDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody key={visibleFields.join(',') + '|' + columns.map((c) => c.field).join(',')}>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     {visibleColumns.map((col) => (
                                         <DataTable.Cell key={col.field}>{renderCell(col.field, item)}</DataTable.Cell>
@@ -4942,6 +5030,7 @@ import { ChevronDown } from '@primeicons/react/chevron-down';
 import { ChevronRight } from '@primeicons/react/chevron-right';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 
@@ -5041,7 +5130,7 @@ export default function ColumnGroupDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<SalesNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -5120,7 +5209,7 @@ import { Database } from '@primeicons/react/database';
 import { SortAlt } from '@primeicons/react/sort-alt';
 import { SortAmountDown } from '@primeicons/react/sort-amount-down';
 import { SortAmountUpAlt } from '@primeicons/react/sort-amount-up-alt';
-import type { DataTableExpansionEvent, DataTableFilterInstance } from '@primereact/ui/datatable';
+import type { DataTableExpansionEvent, DataTableFilterInstance, DataTableTreeRow } from '@primereact/ui/datatable';
 import { DataTable, FilterMatchMode } from '@primereact/ui/datatable';
 import { InputText } from '@primereact/ui/inputtext';
 import { Tag } from '@primereact/ui/tag';
@@ -5240,7 +5329,7 @@ export default function ColumnGroupFilterSortDemo() {
                                         {({ value, onChange }: DataTableFilterInstance) => (
                                             <InputText
                                                 value={(value as string) ?? ''}
-                                                onChange={(e: any) => onChange(e, e.target.value)}
+                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange(e, e.target.value)}
                                                 placeholder="Search"
                                                 size="small"
                                                 fluid
@@ -5254,7 +5343,9 @@ export default function ColumnGroupFilterSortDemo() {
                                         {({ value, onChange }: DataTableFilterInstance) => (
                                             <InputText
                                                 value={(value as string) ?? ''}
-                                                onChange={(e: any) => onChange(e, e.target.value ? Number(e.target.value) : null, 'gte')}
+                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+                                                    onChange(e, e.target.value ? Number(e.target.value) : null, 'gte')
+                                                }
                                                 placeholder="≥"
                                                 size="small"
                                                 fluid
@@ -5267,7 +5358,7 @@ export default function ColumnGroupFilterSortDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<SalesNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -5344,6 +5435,7 @@ import { FilterMatchMode } from '@primereact/ui/datatable';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableFilterInstance } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { IconField } from '@primereact/ui/iconfield';
 import { InputText } from '@primereact/ui/inputtext';
 import { Select, type SelectValueChangeEvent } from '@primereact/ui/select';
@@ -5365,7 +5457,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -5404,7 +5498,7 @@ export default function FilterBasicDemo() {
                         type="search"
                         placeholder="Keyword search"
                         value={globalFilter}
-                        onChange={(e: any) => setGlobalFilter(e.target.value)}
+                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => setGlobalFilter(e.target.value)}
                         className="w-full"
                     />
                 </IconField.Root>
@@ -5440,7 +5534,7 @@ export default function FilterBasicDemo() {
                                         {({ value, onChange }: DataTableFilterInstance) => (
                                             <InputText
                                                 value={(value as string) ?? ''}
-                                                onChange={(e: any) => onChange(e, e.target.value)}
+                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange(e, e.target.value)}
                                                 placeholder="Search name..."
                                                 size="small"
                                                 fluid
@@ -5481,7 +5575,7 @@ export default function FilterBasicDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -5556,6 +5650,7 @@ import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableFilterInstance } from '@primereact/ui/datatable';
 import { Button } from '@primereact/ui/button';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { IconField } from '@primereact/ui/iconfield';
 import { InputText } from '@primereact/ui/inputtext';
 import { Popover, type PopoverRootOpenChangeEvent } from '@primereact/ui/popover';
@@ -5578,7 +5673,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -5717,7 +5814,7 @@ export default function FilterAdvancedDemo() {
                         type="search"
                         placeholder="Keyword search"
                         value={globalFilter}
-                        onChange={(e: any) => setGlobalFilter(e.target.value)}
+                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => setGlobalFilter(e.target.value)}
                         className="w-full"
                     />
                 </IconField.Root>
@@ -5811,7 +5908,9 @@ export default function FilterAdvancedDemo() {
                                                             </div>
                                                             <InputText
                                                                 value={(constraint.value as string) ?? ''}
-                                                                onChange={(e: any) => onConstraintChange(e, idx, e.target.value)}
+                                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+                                                                    onConstraintChange(e, idx, e.target.value)
+                                                                }
                                                                 placeholder="Search by name..."
                                                                 size="small"
                                                                 fluid
@@ -5897,7 +5996,7 @@ export default function FilterAdvancedDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -5962,6 +6061,7 @@ import { NodeService, type TreeTableNode } from '@/shared/services/node.service'
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { Button } from '@primereact/ui/button';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -5984,7 +6084,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -6030,7 +6132,7 @@ export default function ExportDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -6092,6 +6194,7 @@ import { Database } from '@primeicons/react/database';
 import { ChevronRight } from '@primeicons/react/chevron-right';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Skeleton } from '@primereact/ui/skeleton';
 import * as React from 'react';
 
@@ -6209,7 +6312,7 @@ export default function LazyDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => {
+                            {({ item }: { item: DataTableTreeRow<LazyNode> }) => {
                                 const isLoading = loadingKeys[item.key] && expandedKeys[item.key];
 
                                 return (
@@ -6276,6 +6379,7 @@ import { NodeService, type TreeTableNode } from '@/shared/services/node.service'
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import { Button } from '@primereact/ui/button';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { Tag } from '@primereact/ui/tag';
 import * as React from 'react';
 import { File } from '@primeicons/react/file';
@@ -6298,7 +6402,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -6355,7 +6461,7 @@ export default function LoadingOverlayDemo() {
                                 </DataTable.THeadRow>
                             </DataTable.THead>
                             <DataTable.TBody>
-                                {({ item }: { item: any }) => (
+                                {({ item }: { item: DataTableTreeRow<TreeTableNode> }) => (
                                     <DataTable.Row key={String(item.key)}>
                                         <DataTable.Cell>
                                             <div className="flex items-center gap-2">
@@ -6425,7 +6531,7 @@ export default function LoadingSkeletonDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: (typeof placeholders)[number] }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <Skeleton className="h-5 w-3/4" />
@@ -6478,7 +6584,7 @@ export default function EmptyDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item }: { item: any }) => (
+                            {({ item }: { item: Record<string, unknown> }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>{String(item.name)}</DataTable.Cell>
                                     <DataTable.Cell>{String(item.size)}</DataTable.Cell>
@@ -6537,6 +6643,7 @@ import { FilterMatchMode } from '@primereact/ui/datatable';
 import type { DataTableExpansionEvent } from '@primereact/ui/datatable';
 import type { DataTableFilterInstance } from '@primereact/ui/datatable';
 import { DataTable } from '@primereact/ui/datatable';
+import type { DataTableTreeRow } from '@primereact/ui/datatable';
 import { IconField } from '@primereact/ui/iconfield';
 import { InputText } from '@primereact/ui/inputtext';
 import { Select, type SelectValueChangeEvent } from '@primereact/ui/select';
@@ -6558,7 +6665,9 @@ const typeSeverity: Record<string, 'info' | 'warn' | 'success' | 'secondary'> =
 
 function TypeIcon({ type }: { type: string }) {
     if (type === 'Picture') return <ImageIcon size={16} />;
+
     if (type === 'Video') return <Video size={16} />;
+
     if (type === 'Folder') return <Folder size={16} />;
 
     return <File size={16} />;
@@ -6639,7 +6748,7 @@ export default function AdvancedDemo() {
                         type="search"
                         placeholder="Keyword search"
                         value={globalFilter}
-                        onChange={(e: any) => setGlobalFilter(e.target.value)}
+                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => setGlobalFilter(e.target.value)}
                         className="w-full"
                     />
                 </IconField.Root>
@@ -6684,7 +6793,7 @@ export default function AdvancedDemo() {
                                         {({ value, onChange }: DataTableFilterInstance) => (
                                             <InputText
                                                 value={(value as string) ?? ''}
-                                                onChange={(e: any) => onChange(e, e.target.value)}
+                                                onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange(e, e.target.value)}
                                                 placeholder="Search"
                                                 size="small"
                                                 fluid
@@ -6725,7 +6834,7 @@ export default function AdvancedDemo() {
                             </DataTable.THeadRow>
                         </DataTable.THead>
                         <DataTable.TBody>
-                            {({ item, index }: { item: any; index: number }) => (
+                            {({ item, index }: { item: DataTableTreeRow<TreeTableNode>; index: number }) => (
                                 <DataTable.Row key={String(item.key)}>
                                     <DataTable.Cell>
                                         <div className="flex items-center gap-2">
@@ -6745,7 +6854,7 @@ export default function AdvancedDemo() {
                                                 <DataTable.CellEditorContent>
                                                     <InputText
                                                         defaultValue={String(item.name)}
-                                                        onChange={(e: any) => {
+                                                        onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                             pendingValueRef.current[`${item.key}-name`] = e.target.value;
                                                         }}
                                                         size="small"
@@ -6763,7 +6872,7 @@ export default function AdvancedDemo() {
                                             <DataTable.CellEditorContent>
                                                 <InputText
                                                     defaultValue={String(item.size)}
-                                                    onChange={(e: any) => {
+                                                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                                                         pendingValueRef.current[`${item.key}-size`] = e.target.value;
                                                     }}
                                                     size="small"