DropdownItem tag="nuxt-link" does not work

[thedomeffm]

Overview of the problem

Oruga version: [0.5.10]
Vuejs version: [3]
OS/Browser: Chrome

Description

The tag="router-link" tag does work, but tag="nuxt-link" does not.

  <o-dropdown v-if="row.isPaid"
              position="bottom-left"
              aria-role="list">
      <template #trigger="{ active }">
          <button class="button is-ghost has-text-black">
              <o-icon icon="ellipsis-vertical" />
          </button>
      </template>

      <o-dropdown-item tag="router-link"
                       :to="localePath({ name: 'e-id', params: { id: row.code } })"
                       aria-role="listitem">
          <o-icon icon="up-right-from-square" />
          <span>{{ t('table.action.preview') }}</span>
      </o-dropdown-item>

      <o-dropdown-item tag="nuxt-link"
                       :to="localePath({ name: 'e-id', params: { id: row.code } })"
                       aria-role="listitem">
          <o-icon icon="up-right-from-square" />
          <span>{{ t('table.action.preview') }}</span>
      </o-dropdown-item>
  </o-dropdown>

Will result in the following rendered HTML:

Expected behavior

The nuxt-link as tag should work like the router-link. (nuxt does understand my current workaround that I use router-link).

Actual behavior

See screenshot - the first link (with tag="router-link") gets rendered correct.
The second drop-down-item (with tag="nuxt-link") gets rendered as.... a <nuxt-link> and not a <a>.

[thedomeffm]

@jtommy we wrote in Discord about the problem already.
You send me the link => nuxt/nuxt#13659

So it seems like it is the "cOrReCt" behavior of nuxt3 :/

---

This does work => renders correctly,

<o-dropdown-item :tag="defineNuxtLink({})"
                 :to="localePath({ name: 'e-id', params: { id: row.code } })"
                 aria-role="listitem">
    <o-icon icon="up-right-from-square" />
    <span>{{ t('table.action.preview') }}</span>
</o-dropdown-item>

But the "tag" prop should be a String and some errors are thrown.
[Vue warn]: Invalid prop: type check failed for prop "tag". Expected String with value "[object Object]", got Object at <ODropdownItem tag= {name: 'NuxtLink' ...

[andrzejkupczyk]

Thank you for bringing this up. I would like to add that this issue also affects the OButton component.

[fahdaddi]

@jtommy, still having the same issue when using o-button with tag="nuxt-link"... I'm using Nuxt 3