Toast ui issue on notch screen

[vilenleung]

Description

ui issue

CodeSandbox/Snack link

No response

Steps to reproduce

"@gluestack-style/react": "^1.0.17",
"@gluestack-ui/config": "^1.0.4",
"@gluestack-ui/themed": "^1.0.18",
"react": "18.2.0",
"react-native": "0.72.5",

import React, { useEffect } from 'react'
import { GluestackUIProvider, Toast, ToastTitle, useToast } from "@gluestack-ui/themed"
import { config as GluestackConfig } from '@gluestack-ui/config'

const App = () => {
  const toast = useToast()

  useEffect(() => {
    toast.show({
      placement: 'top',
      duration: 4000,
      avoidKeyboard: true,
      render: ({ id }) => {
        return (
          <Toast nativeId={id} action='info' variant='accent'>
            <ToastTitle>Testing</ToastTitle>
          </Toast>
        )
      },
    })
  }, [])
  
  return (
    <> </>
  )
}

export default () => {
  return (
    <GluestackUIProvider config={GluestackConfig}>
      <App/>
    </GluestackUIProvider>
  )
}

gluestack-ui Version

1.0.18

Platform

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

Other Platform

No response

Additional Information

No response

[Viraj-10]

Hey @vilenleung, Thanks for reporting. We will work on this.

[Viraj-10]

Hey @vilenleung, We have fixed this issue in v1.0.19 version of @gluestack-ui/themed.