ModalBackdrop is not working

[macrozone]

Description

ModalBackdrop throws an error when rendered

CodeSandbox/Snack link

not yet

Steps to reproduce

Rendering the ModalBackdrop yields

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ForwardRef`.

the stacktrace reveals:

The above error occurred in the <NotFoundErrorBoundary> component:

    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-style/animation-resolver/lib/module/index.js:233:25)
    at StyledComponent (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-style/react/lib/module/styled.js:683:26)
    at PresenceChild (webpack-internal:///(app-pages-browser)/../../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs:18:23)
    at AnimatePresence (webpack-internal:///(app-pages-browser)/../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs:75:23)
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-style/animation-resolver/lib/module/AnimatedComponents/index.js:55:18)
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-ui/modal/lib/module/OverlayAnimatePresence.js:20:11)
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-ui/modal/lib/module/ModalBackdrop.js:25:15)
    at div
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/react-native-web/dist/exports/View/index.js:66:27)
    at StyledComponent (webpack-internal:///(app-pages-browser)/../../node_modules/@gluestack-style/react/lib/module/styled.js:683:26)
    at div
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/react-native-web/dist/exports/View/index.js:66:27)
    at div
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/react-native-web/dist/exports/View/index.js:66:27)
    at eval (webpack-internal:///(app-pages-browser)/../../node_modules/react-native-web/dist/exports/Modal/Moda

gluestack-ui Version

"@gluestack-ui/modal": "^0.1.32",   "@gluestack-ui/themed": "^1.1.26",

Platform

• Expo
• React Native CLI
• Next
• Web
• Android
• iOS

Other Platform

No response

Additional Information

No response

[rajat693]

Hi @macrozone,

I tried running the modal component example, and it works fine for us. Please share a minimal example that demonstrates your issue.

Thank you.