Merge branch 'main' into feat/angular-flex-render-granular-update

Author: riccardoperra

docs/config.json

@@ -728,6 +728,27 @@
             {
               "to": "framework/vue/examples/filters",
               "label": "Column Filters"
+            },
+            {
+              "to": "framework/vue/examples/virtualized-rows",
+              "label": "Virtualized Rows"
+            }
+          ]
+        },
+        {
+          "label": "vanilla",
+          "children": [
+            {
+              "to": "framework/vanilla/examples/basic",
+              "label": "Basic"
+            },
+            {
+              "to": "framework/vanilla/examples/pagination",
+              "label": "Pagination"
+            },
+            {
+              "to": "framework/vanilla/examples/sorting",
+              "label": "Sorting"
             }
           ]
         }

docs/guide/columns.md

@@ -4,7 +4,7 @@ title: Columns Guide
 
 ## API
 
-[Header API](../../api/core/column)
+[Column API](../../api/core/column)
 
 ## Columns Guide
 

docs/guide/expanding.md

@@ -49,10 +49,10 @@ type Person = {
   id: number
   name: string
   age: number
-  children: Person[]
+  children?: Person[] | undefined
 }
 
-const data: Person =  [
+const data: Person[] =  [
   { id: 1, 
   name: 'John', 
   age: 30, 

docs/guide/global-filtering.md

@@ -106,7 +106,7 @@ const table = useReactTable({
   state: {
     globalFilter,
   },
-  onGlobalFilterChange: setGlobalFilte
+  onGlobalFilterChange: setGlobalFilter
 })
 ```
 

docs/guide/migrating.md

@@ -73,7 +73,7 @@ Types are now included in the base package, so you can remove the `@types/react-
 ### Update column definitions
 
 - accessor was renamed to either `accessorKey` or `accessorFn` (depending on whether you are using a string or function)
-- width, minWidth, maxWidth where renamed to size, minSize, maxSize
+- width, minWidth, maxWidth were renamed to size, minSize, maxSize
 - Optionally, you can use the new `createColumnHelper` function around each column definition for better TypeScript hints. (You can still just use an array of column definitions if you prefer.)
   - The first parameter is the accessor function or accessor string.
   - The second parameter is an object of column options.

examples/react/filters-fuzzy/src/main.tsx

@@ -84,10 +84,10 @@ function App() {
       {
         accessorKey: 'firstName',
         cell: info => info.getValue(),
-        filterFn: 'includesStringSensitive', //note: normal non-fuzzy filter column
+        filterFn: 'includesStringSensitive', //note: normal non-fuzzy filter column - case sensitive
       },
       {
-        accessorFn: row => row.lastName, //note: normal non-fuzzy filter column - case sensitive
+        accessorFn: row => row.lastName,
         id: 'lastName',
         cell: info => info.getValue(),
         header: () => <span>Last Name</span>,

examples/react/kitchen-sink/src/components/ActionButtons.tsx

@@ -76,7 +76,7 @@ export function ActionButtons<T extends RowData>({
           <input
             type="number"
             min="1"
-            max={table.getPageCount()}
+            max={pageCount}
             defaultValue={pageIndex + 1}
             onChange={e => {
               const page = e.target.value ? Number(e.target.value) - 1 : 0

examples/react/virtualized-infinite-scrolling/src/main.tsx

@@ -184,7 +184,7 @@ function App() {
       ({flatData.length} of {totalDBRowCount} rows fetched)
       <div
         className="container"
-        onScroll={e => fetchMoreOnBottomReached(e.target as HTMLDivElement)}
+        onScroll={e => fetchMoreOnBottomReached(e.currentTarget)}
         ref={tableContainerRef}
         style={{
           overflow: 'auto', //our scrollable table container

examples/vanilla/basic/.gitignore

@@ -0,0 +1,5 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local

examples/vanilla/basic/README.md

@@ -0,0 +1,6 @@
+# Example
+
+To run this example:
+
+- `npm install` or `yarn`
+- `npm run start` or `yarn start`