chore: Add knip and sherif (#5357)

* Add knip and sherif

* Update Nx command

Author: lachlancollins

babel.config.cjs

@@ -21,7 +21,6 @@ module.exports = {
     '@babel/preset-typescript',
   ],
   plugins: [
-    // 'babel-plugin-transform-async-to-promises',
     cjs && ['@babel/transform-modules-commonjs', { loose }],
     // [
     //   '@babel/transform-runtime',

knip.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://unpkg.com/knip@4/schema.json",
+  "ignoreWorkspaces": ["examples/**"],
+  "workspaces": {
+    "packages/match-sorter-utils": {
+      "ignoreDependencies": ["remove-accents"]
+    },
+    "packages/react-table": {
+      "ignore": ["**/*.notest.*", "**/makeTestData.ts"]
+    }
+  }
+}

nx.json

@@ -44,9 +44,17 @@
       "outputs": ["{projectRoot}/build", "{projectRoot}/dist"],
       "cache": true
     },
+    "test:knip": {
+      "cache": true,
+      "inputs": ["{workspaceRoot}/**/*"]
+    },
     "test:format": {
       "cache": true,
       "inputs": ["{workspaceRoot}/**/*"]
+    },
+    "test:sherif": {
+      "cache": true,
+      "inputs": ["{workspaceRoot}/**/*"]
     }
   }
 }

package.json

@@ -8,12 +8,14 @@
     "clean": "pnpm --filter \"./packages/**\" run clean",
     "preinstall": "node -e \"if(process.env.CI == 'true') {console.log('Skipping preinstall...'); process.exit(1)}\" || npx -y only-allow pnpm",
     "test": "pnpm run test:ci",
-    "test:pr": "nx affected --targets=test:format,test:lib,test:types,build",
-    "test:ci": "nx run-many --targets=test:format,test:lib,test:types,build",
+    "test:pr": "nx affected --targets=test:format,test:sherif,test:knip,test:lib,test:types,build",
+    "test:ci": "nx run-many --targets=test:format,test:sherif,test:knip,test:lib,test:types,build",
     "test:format": "pnpm run prettier --check",
+    "test:sherif": "sherif",
     "test:lib": "nx affected --targets=test:lib --exclude=examples/**",
     "test:lib:dev": "pnpm test:lib && nx watch --all -- pnpm test:lib",
     "test:types": "nx affected --targets=test:types --exclude=examples/**",
+    "test:knip": "knip",
     "build": "nx affected --targets=build --exclude=examples/**",
     "build:all": "nx run-many --targets=build --exclude=examples/**",
     "watch": "pnpm run build:all && nx watch --all -- pnpm run build:all",
@@ -24,7 +26,9 @@
   },
   "nx": {
     "includedScripts": [
-      "test:format"
+      "test:format",
+      "test:knip",
+      "test:sherif"
     ]
   },
   "namespace": "@tanstack",
@@ -43,12 +47,11 @@
     "@testing-library/jest-dom": "^6.2.0",
     "@testing-library/react": "^14.1.2",
     "@testing-library/react-hooks": "^8.0.1",
-    "@tsconfig/svelte": "^5.0.2",
     "@types/node": "^18.19.4",
-    "@types/react": "^18.2.45",
+    "@types/react": "^18.2.48",
     "@types/react-dom": "^18.2.18",
-    "babel-plugin-transform-async-to-promises": "^0.8.18",
     "jsdom": "^23.2.0",
+    "knip": "^4.6.0",
     "nx": "^17.2.8",
     "prettier": "^4.0.0-alpha.8",
     "prettier-plugin-svelte": "^3.1.2",
@@ -59,11 +62,9 @@
     "rollup-plugin-size": "^0.3.1",
     "rollup-plugin-svelte": "^7.1.6",
     "rollup-plugin-visualizer": "^5.12.0",
-    "solid-js": "^1.8.11",
+    "sherif": "^0.7.0",
     "svelte": "^4.2.8",
     "typescript": "5.3.3",
-    "vite": "^5.0.11",
-    "vitest": "^1.2.0",
-    "vue": "^3.4.14"
+    "vitest": "^1.2.0"
   }
 }

packages/react-table-devtools/src/Explorer.tsx

@@ -4,35 +4,35 @@ import React from 'react'
 
 import { styled } from './utils'
 
-export const Entry = styled('div', {
+const Entry = styled('div', {
   fontFamily: 'Menlo, monospace',
   fontSize: '0.7rem',
   lineHeight: '1.7',
   outline: 'none',
   wordBreak: 'break-word',
 })
 
-export const Label = styled('span', {
+const Label = styled('span', {
   cursor: 'pointer',
   color: 'white',
 })
 
-export const Value = styled('span', (props, theme) => ({
+const Value = styled('span', (props, theme) => ({
   color: theme.danger,
 }))
 
-export const SubEntries = styled('div', {
+const SubEntries = styled('div', {
   marginLeft: '.1rem',
   paddingLeft: '1rem',
   borderLeft: '2px solid rgba(0,0,0,.15)',
 })
 
-export const Info = styled('span', {
+const Info = styled('span', {
   color: 'grey',
   fontSize: '.7rem',
 })
 
-export const Expander = ({ expanded, style = {}, ...rest }) => (
+const Expander = ({ expanded, style = {}, ...rest }) => (
   <span
     style={{
       display: 'inline-block',

packages/react-table-devtools/src/styledComponents.ts

@@ -20,7 +20,7 @@ export const Panel = styled(
   }
 )
 
-export const ActivePanel = styled(
+const ActivePanel = styled(
   'div',
   () => ({
     flex: '1 1 500px',
@@ -63,11 +63,11 @@ export const Button = styled('button', (props, theme) => ({
 //   borderRadius: '.2em',
 // })
 
-export const Code = styled('code', {
+const Code = styled('code', {
   fontSize: '.9em',
 })
 
-export const Input = styled('input', (_props, theme) => ({
+const Input = styled('input', (_props, theme) => ({
   backgroundColor: theme.inputBackgroundColor,
   border: 0,
   borderRadius: '.2em',
@@ -77,7 +77,7 @@ export const Input = styled('input', (_props, theme) => ({
   padding: '.3em .4em',
 }))
 
-export const Select = styled(
+const Select = styled(
   'select',
   (_props, theme) => ({
     display: `inline-block`,

packages/react-table-devtools/src/utils.ts

@@ -3,7 +3,7 @@ import React from 'react'
 import { Theme, useTheme } from './theme'
 import useMediaQuery from './useMediaQuery'
 
-export const isServer = typeof window === 'undefined'
+const isServer = typeof window === 'undefined'
 
 type StyledComponent<T> = T extends 'button'
   ? React.DetailedHTMLProps<
@@ -104,7 +104,7 @@ export function useIsMounted() {
  * to prevent updating a component state while React is rendering different components
  * or when the component is not mounted anymore.
  */
-export function useSafeState<T>(initialState: T): [T, (value: T) => void] {
+function useSafeState<T>(initialState: T): [T, (value: T) => void] {
   const isMounted = useIsMounted()
   const [state, setState] = React.useState(initialState)
 

packages/react-table/package.json

@@ -54,10 +54,8 @@
     "@tanstack/table-core": "workspace:*"
   },
   "devDependencies": {
-    "@types/react": "^18.2.45",
-    "@types/react-dom": "^18.2.18",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "@types/react": "^18.2.48",
+    "react": "^18.2.0"
   },
   "peerDependencies": {
     "react": ">=16",

packages/table-core/src/utils/filterRowsUtils.ts

@@ -13,7 +13,7 @@ export function filterRows<TData extends RowData>(
   return filterRowModelFromRoot(rows, filterRowImpl, table)
 }
 
-export function filterRowModelFromLeafs<TData extends RowData>(
+function filterRowModelFromLeafs<TData extends RowData>(
   rowsToFilter: Row<TData>[],
   filterRow: (row: Row<TData>) => Row<TData>[],
   table: Table<TData>
@@ -77,7 +77,7 @@ export function filterRowModelFromLeafs<TData extends RowData>(
   }
 }
 
-export function filterRowModelFromRoot<TData extends RowData>(
+function filterRowModelFromRoot<TData extends RowData>(
   rowsToFilter: Row<TData>[],
   filterRow: (row: Row<TData>) => any,
   table: Table<TData>

packages/vue-table/src/merge-proxy.ts

@@ -2,7 +2,7 @@ function trueFn() {
   return true
 }
 
-export const $PROXY = Symbol('merge-proxy')
+const $PROXY = Symbol('merge-proxy')
 
 // https://github.com/solidjs/solid/blob/c20ca4fd8c36bc0522fedb2c7f38a110b7ee2663/packages/solid/src/render/component.ts#L51-L118
 const propTraps: ProxyHandler<{

pnpm-lock.yaml

@@ -2,6 +2,7 @@
 
 import { resolve } from 'node:path'
 import { babel } from '@rollup/plugin-babel'
+import commonJS from '@rollup/plugin-commonjs'
 import { visualizer } from 'rollup-plugin-visualizer'
 import terser from '@rollup/plugin-terser'
 // @ts-expect-error
@@ -89,6 +90,7 @@ function mjs({ input, external, banner, outputFile }) {
           hydratable: true,
         },
       }),
+      commonJS(),
       babelPlugin,
       nodeResolve({ extensions: ['.ts', '.tsx'] }),
     ],
@@ -122,6 +124,7 @@ function esm({ input, external, banner, outputFile }) {
           hydratable: true,
         },
       }),
+      commonJS(),
       babelPlugin,
       nodeResolve({ extensions: ['.ts', '.tsx'] }),
     ],
@@ -153,6 +156,7 @@ function cjs({ input, external, banner }) {
     },
     plugins: [
       svelte(),
+      commonJS(),
       babelPlugin,
       nodeResolve({ extensions: ['.ts', '.tsx'] }),
     ],
@@ -184,6 +188,7 @@ function umdDev({ input, external, globals, banner, jsName }) {
     },
     plugins: [
       svelte(),
+      commonJS(),
       babelPlugin,
       nodeResolve({ extensions: ['.ts', '.tsx'] }),
       forceEnvPlugin('development'),
@@ -216,6 +221,7 @@ function umdProd({ input, external, globals, banner, jsName }) {
     },
     plugins: [
       svelte(),
+      commonJS(),
       babelPlugin,
       nodeResolve({ extensions: ['.ts', '.tsx'] }),
       forceEnvPlugin('production'),