The ptOptions property is not working with nested components

[adiramardiani]

Describe the bug

Hi @mertsincan @tugcekucukoglu
Yes I now on 3.34 has BC about mergeProps, but is the mergeProps option recursive to another sub class component ?
I write like this

<Menubar
      :pt-options="{ mergeProps: true }"
      :pt="{
        root: { class: 'some-class' },
        label: { class: 'some-class' },
        menu: {
          class: 'menu-for-ul-class' //my expectation this will  merge with default tailwind class
        }
      }"
    >

But the render like this, not merge

<ul class="menu-for-ul-class" data-pc-section="menu" role="menubar" tabindex="0" >...</ul>

I write like this, but the render is same

<Menubar
      :pt-options="{ mergeProps: true }"
      :pt="{
        root: { class: 'some-class' },
        label: { class: 'some-class' },
        menu: {
          class: 'menu-for-ul-class',
          ptOptions: {
            mergeProps: true
          }
        }
      }"
    >

About menu pt in menubar I refer on this documentation MenuBar

Reproducer

https://codesandbox.io/s/primevue-create-vue-issue-template-kw9g6i

PrimeVue version

3.34

Vue version

3.x

Language

ALL

Build / Runtime

Nuxt

Browser(s)

No response

Steps to reproduce the behavior

I write like this

<Menubar
      :pt-options="{ mergeProps: true }"
      :pt="{
        root: { class: 'some-class' },
        label: { class: 'some-class' },
        menu: {
          class: 'menu-for-ul-class'
        }
      }"
    >

But the render like this, not merge

<ul class="menu-for-ul-class" data-pc-section="menu" role="menubar" tabindex="0" >...</ul>

Expected behavior

My expectation ul class (ul) is combination this pt and tailwind default pt class
About menu pt in menubar I refer on this documentation MenuBar

[awkoy]

Has the same issue

const Tailwind_PT: PrimeVuePTOptions = {
  button: {
    root: {
      class:
        'text-appBlack bg-appPrimary border-appPrimary hover:bg-appSecondary hover:border-appSecondary focus:shadow-n'
    }
  }
}

export const CustomTailwind = usePassThrough(Tailwind, Tailwind_PT, {
  mergeSections: true,
  mergeProps: true,
})

app.use(PrimeVue, { unstyled: true, pt: CustomTailwind })

renders

I've expected, that it should merge my classes list with an existed one from PrimeVue

if (matched) {
    to[key] = getValue(
        useMergeProps
              ? mergeProps(getPTClassValue(to[key]), getPTClassValue(from[key]))
              : { ...getPTClassValue(to[key]), ...getPTClassValue(from[key]) }
     )
}

getPTClassValue(to[key]) - this method returns function({props, context})