Toaster from shadn/Sonner it is not shown

I'm working in a Vue monorepo with a custom UI package. I want to use the Sonner toast component (vue-sonner v2) following the official shadcn-vue guide. I've set everything up without any import errors or runtime exceptions, but the toast notification never renders when I trigger toast(...).

Directory Structure:

• packages/ui/src/components/ui/sonner/VSonner.vue
• packages/ui/src/components/ui/sonner/index.ts
• packages/ui/src/index.ts
• Main app in apps/www

packages/ui/src/components/ui/sonner/VSonner.vue:

<script lang="ts" setup>
import type { ToasterProps } from 'vue-sonner'
import { Toaster as Sonner } from 'vue-sonner'
const props = defineProps<ToasterProps>()
</script>
<template>
<Sonner
class="toaster group"
v-bind="props"
:style="{
'--normal-bg': 'var(--popover)',
'--normal-text': 'var(--popover-foreground)',
'--normal-border': 'var(--border)',
}"
/>
</template>

packages/ui/src/components/ui/sonner/index.ts:

export { default as Toaster } from './VSonner.vue'

packages/ui/src/index.ts:

export * from '@/components/ui/sonner'
export { default as Toaster } from '@/components/ui/sonner/VSonner.vue'

App.vue usage

In my main app App.vue:

<template>
  <ThemeProvider>
    <TooltipProvider>
      <main-layout />
    </TooltipProvider>
  </ThemeProvider>
  <Toaster />
</template>
<script setup lang="ts">
import 'vue-sonner/style.css'
import { Toaster, TooltipProvider } from '@ist/ui'
</script>

Toast usage

An example button on my view:

<Button
  variant="outline"
  @click="
    () => {
      toast('Event has been created', {
        description: 'Sunday, December 03, 2023 at 9:00 AM',
        action: {
          label: 'Undo',
          onClick: () => console.log('Undo'),
        },
      });
    }
  "
>
  Add to calendar
</Button>

Imports in the view:

import { toast } from 'vue-sonner'
import { Toaster, Button } from '@ist/ui'

Problem

• No import errors
• Toaster appears in component tree (inspected in Vue DevTools)
• Clicking the button executes the toast call (confirmed via debugging), but no toast appears on the page
• No error output of any kind

What I tried:

• Ensured vue-sonner/style.css is imported at app level
• Confirmed only one at root
• Using toast() both in the view and in the component script

What might cause Sonner not to appear in this monorepo/custom UI export setup, and how can this be debugged further?

Additional details:

vue-sonner version: 2.0.8

UI library and app both use the same Vue version.

All component registration and usage works fine for other UI components from @ist/ui

Tried both direct import of Toaster from 'vue-sonner' and from my package