atlassian / react-beautiful-dnd

Beautiful and accessible drag and drop for lists with React

Home Page:https://react-beautiful-dnd.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Unable to work in Next.js 14

caohonghai opened this issue · comments

Expected behavior

I expect to be able to drag and sort

Actual behavior

Unable to drag, and console error as follows

Warning: Connect(Droppable): Support for defaultProps will be removed from memo components in a future major release. Use JavaScript default parameters instead.

Steps to reproduce

Suggested solution?

What version of React are you using?

What version of react-beautiful-dnd are you running?

{
  "name": "nextjs",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@types/react-beautiful-dnd": "13.1.8",
    "next": "14.1.4",
    "react": "^18",
    "react-beautiful-dnd": "13.1.1",
    "react-dom": "^18"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "autoprefixer": "^10.4.19",
    "eslint": "^8",
    "eslint-config-next": "14.1.4",
    "postcss": "^8",
    "tailwindcss": "^3.3.0",
    "typescript": "^5"
  }
}

What browser are you using?

Demo

codesandbox