Doesn't work in React Vite

[pepsiamir]

I got BottomSheet working in Next.js but in React I get the following error:

`web.js:508 Uncaught TypeError: Cannot read properties of undefined (reading 'getValue') at web.js:508:57 at Array.map () at AnimatedInterpolation.getValue (web.js:508:38) at AnimatedStyle.getValue (web.js:173:98) at AnimatedProps.getValue (web.js:173:98) at web.js:303:45 at renderWithHooks (react-dom.development.js:16305:18) at updateForwardRef (react-dom.development.js:19226:20) at beginWork (react-dom.development.js:21636:16) at HTMLUnknownElement.callCallback2 (react-dom.development.js:4164:14) (anonymous) @ web.js:508 getValue @ web.js:508 getValue @ web.js:173 getValue @ web.js:173 (anonymous) @ web.js:303 renderWithHooks @ react-dom.development.js:16305 updateForwardRef @ react-dom.development.js:19226 beginWork @ react-dom.development.js:21636 callCallback2 @ react-dom.development.js:4164 invokeGuardedCallbackDev @ react-dom.development.js:4213 invokeGuardedCallback @ react-dom.development.js:4277 beginWork$1 @ react-dom.development.js:27451 performUnitOfWork @ react-dom.development.js:26557 workLoopSync @ react-dom.development.js:26466 renderRootSync @ react-dom.development.js:26434 recoverFromConcurrentError @ react-dom.development.js:25850 performSyncWorkOnRoot @ react-dom.development.js:26096 flushSyncCallbacks @ react-dom.development.js:12042 commitRootImpl @ react-dom.development.js:26959 commitRoot @ react-dom.development.js:26682 finishConcurrentRender @ react-dom.development.js:25936 performConcurrentWorkOnRoot @ react-dom.development.js:25809 workLoop @ scheduler.development.js:266 flushWork @ scheduler.development.js:239 performWorkUntilDeadline @ scheduler.development.js:533 react-dom.development.js:18687 The above error occurred in the <ForwardRef> component:

at http://127.0.0.1:5173/node_modules/.vite/deps/react-spring-bottom-sheet.js?v=e089520f:6403:25
at http://127.0.0.1:5173/node_modules/.vite/deps/react-spring-bottom-sheet.js?v=e089520f:10940:14
at Portal2 (http://127.0.0.1:5173/node_modules/.vite/deps/react-spring-bottom-sheet.js?v=e089520f:1716:24)
at http://127.0.0.1:5173/node_modules/.vite/deps/react-spring-bottom-sheet.js?v=e089520f:11312:15
at Mahnegar (http://127.0.0.1:5173/src/components/Mahnegar.jsx?t=1690450579063:49:16)
at RenderedRoute (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=e089520f:3115:5)
at Routes (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=e089520f:3483:5)
at div
at Router (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=e089520f:3430:15)
at BrowserRouter (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=e089520f:3851:5)
at SessionAuth (http://127.0.0.1:5173/node_modules/.vite/deps/chunk-BOIIUMNT.js?v=e089520f:69:25)
at UserContextProvider (http://127.0.0.1:5173/node_modules/.vite/deps/chunk-BOIIUMNT.js?v=e089520f:40:25)
at UserContextWrapper (http://127.0.0.1:5173/node_modules/.vite/deps/chunk-BOIIUMNT.js?v=e089520f:48:17)
at SessionAuthWrapper (http://127.0.0.1:5173/node_modules/.vite/deps/chunk-BOIIUMNT.js?v=e089520f:377:32)
at SuperTokensWrapper
at Provider (http://127.0.0.1:5173/node_modules/.vite/deps/react-redux.js?v=e089520f:1210:3)
at App (http://127.0.0.1:5173/src/App.jsx?t=1690450579063:263:66)

`

[yoshintame]

Same, but it's not working only in React.StrictMode.

Looking at the number of open and ignored issues makes me sad, it looks like this repository is no longer maintained.

[kerk12]

It's not working in NextJS v13.5 either...

[hotgeart]

Same, did you find an alternative package ?

[pepsiamir]

Same, did you find an alternative package ?

There are many alternative libraries. I use framer-motion. you can find a similar package here with the sample code. https://socket.dev/npm/package/slick-bottom-sheet

Demo: https://slick-bottom-sheet.vercel.app/