Nuxt•2mo ago

Default openDelay for Popovers in Nuxt UI v3.3.0

Hey, with Nuxt UI v2.22 I was able to define a default openDelay in my app.config.ts, but I don't see this option anymore. Here's what worked in Nuxt UI v2.22:

export default defineAppConfig({
  ui: {
    popover: {
      default: {
        openDelay: 200,
      },
    },
  },
})

export default defineAppConfig({
  ui: {
    popover: {
      default: {
        openDelay: 200,
      },
    },
  },
})

Is there any way to achieve this in Nuxt UI v3.3.0?

2 Replies

kapa.ai•2mo ago

Hi @Shufflepuff. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In Nuxt UI v3.3.0, the theming and configuration system has changed significantly compared to v2. The previous approach of setting default props like openDelay for Popovers in app.config.ts is now obsolete. The new theming system uses Tailwind Variants and focuses on overriding component slots and variants, not default prop values like openDelay or closeDelay globally. You can still set openDelay and closeDelay per instance using the open-delay and close-delay props on the <UPopover> component:

<UPopover mode="hover" :open-delay="500" :close-delay="300">
  <UButton label="Open" color="neutral" variant="subtle" />
  <template #content>
    <Placeholder class="size-48 m-4 inline-flex" />
  </template>
</UPopover>

<UPopover mode="hover" :open-delay="500" :close-delay="300">
  <UButton label="Open" color="neutral" variant="subtle" />
  <template #content>
    <Placeholder class="size-48 m-4 inline-flex" />
  </template>
</UPopover>

But there is no documented way to set a global default for openDelay for all Popovers in v3.3.0 via app.config.ts or theming options. The knowledge sources do not mention any replacement for this feature in the new version, and the theming system is now focused on styling (slots, variants) rather than default prop values Getting-started > Changes from v2 Popover documentation. Summary:
You must set open-delay on each <UPopover> instance as needed. There is currently no global config for this in Nuxt UI v3.3.0. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2mo ago

<@128217979732230144> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Default openDelay for Popovers in Nuxt UI v3.3.0

Did you find this page helpful?