primefaces / primevue

Next Generation Vue UI Component Library
https://primevue.org
MIT License
9.47k stars 1.14k forks source link

DataTable: Pass Through keys for emptyMessage not working #6006

Open msladek opened 1 month ago

msladek commented 1 month ago

Describe the bug

In the DataTable pass through keys for emptyMessage aren't working, namely:

Attributes set in the pass through object for the keys don't appear in the DOM tree.

Reproducer

PrimeVue 3: https://stackblitz.com/edit/primevue-3-vite-issue-template-kq9t6x?file=src%2FApp.vue PrimeVue 4: https://stackblitz.com/edit/primevue-4-vite-issue-template-1kh2cr?file=src%2FApp.vue

PrimeVue version

3.53.0 / 4.0.0-rc.3

Vue version

4.x

Language

ALL

Build / Runtime

Vue CLI App

Browser(s)

No response

Expected behavior

Pass through attributes like class for the keys should appear in the DOM tree.

code3z commented 1 month ago

Hey, this may be the wrong place to put this, but pt:pcCloseButton on <Dialog /> is not working either. Here's the code:

    <Dialog
      :visible="true"
      modal
      header="Edit Profile"
      class="max-w-96 bg-white p-8"
      :draggable="false"
      pt:pcCloseButton="!bg-transparent"
      pt:header="heading-sm"
    >
      <span class="text-surface-500 dark:text-surface-400 block mb-8">Update your information.</span>

        <label for="email" class="font-semibold w-24 block">Email</label>
        <InputText
          id="email"
          type="email"
          placeholder="you@example.com"
          class="flex-auto"
        />
    </Dialog>

I am also using unstyled + tailwind.

Edit: :closeButtonProps="{ class: 'something' }" works

pohsiu commented 1 month ago

I thought pt:pcCloseButton:class="bg-transparent" should work

davision commented 1 day ago

Hey, this may be the wrong place to put this, but pt:pcCloseButton on <Dialog /> is not working either. Here's the code:

    <Dialog
      :visible="true"
      modal
      header="Edit Profile"
      class="max-w-96 bg-white p-8"
      :draggable="false"
      pt:pcCloseButton="!bg-transparent"
      pt:header="heading-sm"
    >
      <span class="text-surface-500 dark:text-surface-400 block mb-8">Update your information.</span>

        <label for="email" class="font-semibold w-24 block">Email</label>
        <InputText
          id="email"
          type="email"
          placeholder="you@example.com"
          class="flex-auto"
        />
    </Dialog>

I am also using unstyled + tailwind.

Edit: :closeButtonProps="{ class: 'something' }" works

Testing with 4.0.4 and this is still the case. Defining classes for pcCloseButton, does nothing.