fix: partial support for react 19, bump deps, tag requests, use async visibility

commitlint.config.js

@@ -1,3 +1,3 @@
-module.exports = {
+export default {
   extends: ['@commitlint/config-conventional'],
 }

lint-staged.config.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   '**/*.{js,jsx}': ['eslint'],
   '**/*.{ts,tsx}': ['eslint', () => 'tsc --build'],
 }

package.config.ts

@@ -1,7 +1,6 @@
 import {defineConfig} from '@sanity/pkg-utils'
 
 export default defineConfig({
-  legacyExports: true,
   dist: 'lib',
   tsconfig: 'tsconfig.lib.json',
 

package.json

@@ -16,19 +16,19 @@
   },
   "license": "MIT",
   "author": "Sanity.io <[email protected]>",
+  "sideEffects": false,
+  "type": "module",
   "exports": {
     ".": {
-      "types": "./lib/index.d.ts",
       "source": "./src/index.ts",
-      "require": "./lib/index.js",
-      "import": "./lib/index.esm.js",
-      "default": "./lib/index.esm.js"
+      "import": "./lib/index.js",
+      "require": "./lib/index.cjs",
+      "default": "./lib/index.js"
     },
     "./package.json": "./package.json"
   },
-  "main": "./lib/index.js",
-  "module": "./lib/index.esm.js",
-  "source": "./src/index.ts",
+  "main": "./lib/index.cjs",
+  "module": "./lib/index.js",
   "types": "./lib/index.d.ts",
   "files": [
     "lib",
@@ -37,71 +37,67 @@
     "v2-incompatible.js"
   ],
   "scripts": {
-    "prebuild": "npm run clean && plugin-kit verify-package --silent && pkg-utils",
-    "build": "run-s clean && plugin-kit verify-package --silent && pkg-utils build --strict && pkg-utils --strict",
+    "build": "plugin-kit verify-package --silent && pkg-utils build --strict --check --clean",
     "clean": "rimraf lib",
     "compile": "tsc --noEmit",
     "format": "prettier --write --cache --ignore-unknown .",
     "link-watch": "plugin-kit link-watch",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "prepare": "husky install",
-    "prepublishOnly": "run-s build",
+    "prepublishOnly": "npm run build",
     "watch": "pkg-utils watch --strict"
   },
   "husky": {
     "hooks": {
       "pre-commit": "npm run lint:fix"
     }
   },
+  "browserslist": "extends @sanity/browserslist-config",
   "dependencies": {
-    "@hello-pangea/dnd": "^16.2.0",
-    "@sanity/icons": "^2.4.1",
-    "@sanity/incompatible-plugin": "^1.0.4",
-    "@sanity/ui": "^1.7.1",
+    "@hello-pangea/dnd": "^17.0.0",
+    "@sanity/icons": "^3.5.3",
+    "@sanity/incompatible-plugin": "^1.0.5",
+    "@sanity/ui": "^2.10.11",
     "lexorank": "^1.0.4",
-    "prop-types": "^15.8.1",
-    "sanity-plugin-utils": "^1.6.2"
+    "sanity-plugin-utils": "^1.6.7"
   },
   "devDependencies": {
-    "@commitlint/cli": "^17.6.6",
-    "@commitlint/config-conventional": "^17.6.6",
-    "@sanity/pkg-utils": "^2.3.3",
-    "@sanity/plugin-kit": "^3.1.7",
-    "@sanity/semantic-release-preset": "^4.1.6",
-    "@types/react": "^18.2.14",
+    "@commitlint/cli": "^19.6.1",
+    "@commitlint/config-conventional": "^19.6.0",
+    "@sanity/pkg-utils": "^6.12.0",
+    "@sanity/plugin-kit": "^4.0.18",
+    "@sanity/semantic-release-preset": "^5.0.0",
+    "@types/react": "^18.3.1",
     "@typescript-eslint/eslint-plugin": "^5.61.0",
     "@typescript-eslint/parser": "^5.61.0",
-    "autoprefixer": "^10.3.6",
     "babel-eslint": "^10.1.0",
     "eslint": "^8.44.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-config-sanity": "^6.0.0",
-    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.3",
-    "npm-run-all": "^4.1.5",
-    "prettier": "^2.8.8",
-    "prettier-plugin-packagejson": "^2.4.4",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-is": "^18.2.0",
-    "rimraf": "^5.0.1",
-    "sanity": "^3.23.0",
-    "semantic-release": "^22.0.6",
+    "prettier": "^3.4.2",
+    "prettier-plugin-packagejson": "^2.5.6",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-is": "^18.3.1",
+    "rimraf": "^6.0.1",
+    "sanity": "^3.67.1",
+    "semantic-release": "^24.2.0",
     "typescript": "^5.1.6"
   },
   "peerDependencies": {
-    "@sanity/ui": "^1.0 || ^2.0",
-    "react": "^18",
-    "react-dom": "^18",
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19",
     "sanity": "^3.0.0",
-    "styled-components": "^5.0 || ^6.0"
+    "styled-components": "^6.1"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   },
   "sanityExchangeUrl": "https://www.sanity.io/plugins/orderable-document-list"
 }

src/Document.tsx

@@ -5,7 +5,7 @@ import {useSchema, SchemaType, PreviewCard, Preview} from 'sanity'
 import {usePaneRouter} from 'sanity/structure'
 
 import {OrderableContext} from './OrderableContext'
-import {SanityDocumentWithOrder} from './types'
+import type {SanityDocumentWithOrder} from './types'
 
 export interface DocumentProps {
   doc: SanityDocumentWithOrder
@@ -14,15 +14,15 @@ export interface DocumentProps {
     index: number,
     nextIndex: number,
     docId: string,
-    entities: SanityDocumentWithOrder[]
+    entities: SanityDocumentWithOrder[],
   ) => void
   index: number
   isFirst: boolean
   isLast: boolean
   dragBadge: number | false
 }
 
-export default function Document({
+export function Document({
   doc,
   increment,
   entities,
@@ -45,7 +45,7 @@ export default function Document({
       function LinkComponent(linkProps: {children: ReactNode}) {
         return <ChildLink {...linkProps} childId={doc._id} />
       },
-    [ChildLink, doc._id]
+    [ChildLink, doc._id],
   )
 
   return (

src/DocumentListQuery.tsx

@@ -2,9 +2,9 @@ import {useEffect, useMemo, useState} from 'react'
 import {Box, Flex, Container, Spinner, Stack, Text} from '@sanity/ui'
 
 import {useListeningQuery, Feedback} from 'sanity-plugin-utils'
-import DraggableList from './DraggableList'
+import {DraggableList} from './DraggableList'
 import {ORDER_FIELD_NAME} from './helpers/constants'
-import {SanityDocumentWithOrder} from './types'
+import type {SanityDocumentWithOrder} from './types'
 
 export interface DocumentListQueryProps {
   type: string
@@ -14,11 +14,7 @@ export interface DocumentListQueryProps {
 
 const DEFAULT_PARAMS = {}
 
-export default function DocumentListQuery({
-  type,
-  filter,
-  params = DEFAULT_PARAMS,
-}: DocumentListQueryProps) {
+export function DocumentListQuery({type, filter, params = DEFAULT_PARAMS}: DocumentListQueryProps) {
   const [listIsUpdating, setListIsUpdating] = useState(false)
   const [data, setData] = useState<SanityDocumentWithOrder[] | null>([])
 
@@ -32,13 +28,15 @@ export default function DocumentListQuery({
   }
 
   const {
-    data: queryData,
+    data: _queryData,
     loading,
     error,
   } = useListeningQuery<SanityDocumentWithOrder[]>(query, {
     params: queryParams,
     initialValue: [],
   })
+  // @ts-expect-error Should not be needed to "cast", but sanity-plugin-utils is not typed correctly
+  const queryData: SanityDocumentWithOrder[] = _queryData
 
   useEffect(() => {
     if (queryData) {
@@ -63,7 +61,7 @@ export default function DocumentListQuery({
 
   const unorderedDataCount = useMemo(
     () => (data?.length ? data.filter((doc) => !doc[ORDER_FIELD_NAME]).length : 0),
-    [data]
+    [data],
   )
 
   if (loading) {

src/DocumentListWrapper.tsx

@@ -1,10 +1,9 @@
 import {useEffect, useMemo} from 'react'
-import {useToast} from '@sanity/ui'
+import {useToast, Box, type ToastParams} from '@sanity/ui'
 
 import {useSchema} from 'sanity'
-import {Box, type ToastParams} from '@sanity/ui'
 import {Feedback} from 'sanity-plugin-utils'
-import DocumentListQuery from './DocumentListQuery'
+import {DocumentListQuery} from './DocumentListQuery'
 import {OrderableContext} from './OrderableContext'
 
 import {ORDER_FIELD_NAME} from './helpers/constants'
@@ -21,7 +20,7 @@ export interface DocumentListWrapperProps {
 
 // 1. Validate first that the schema has been configured for ordering
 // 2. Setup context for showIncrements
-export default function DocumentListWrapper({
+export function DocumentListWrapper({
   type,
   showIncrements,
   resetOrderTransaction,
@@ -75,7 +74,7 @@ export default function DocumentListWrapper({
     if (
       'fields' in typeSchema &&
       typeSchema.fields.some(
-        (field) => field?.name === ORDER_FIELD_NAME && field?.type?.name !== 'string'
+        (field) => field?.name === ORDER_FIELD_NAME && field?.type?.name !== 'string',
       )
     ) {
       return (