DynamicDialog: passing pt when opening new dialogs

[rubjo]

Describe the feature you would like to see added

It would be really nice to have some documentation / examples on how to pass pt when opening new dynamic dialogs.

dialog.open(MyComponent, {
  props: {
    header: 'Hey there,
    pt: {
      root: { class: 'some-class' },
    },
  }

...doesn't seem to do the trick.

Is your feature request related to a problem?

No response

Describe the solution you'd like

No response

Describe alternatives you have considered

No response

Additional context

No response

[zejji]

+1 for this

Passing pt when opening new dynamic dialogs appears to do nothing at all (I have tried adding a breakpoint to any of the functions contained within my passed options and the functions never get called).

Accordingly, it would be useful to understand whether this is intentional behavior and, if so, how it is possible to customize a dynamic dialog (e.g. by applying custom classes), as this currently appears to be impossible.

If relevant, I'm using the Tailwind integration.

[mwhit24]

So is there no way currently to style the DynamicDialog component using Tailwind passthrough? I am running into the issue where no style is showing up.

[davidphotodev]

Yes, that's happening to me.
I'm trying to do the same thing and absolutly nothing is happening.

Even, i'm trying to use breakpoints and they are never executed.

What coud be happening?

[mikk837k]

I've got the same issue, some props used for the DynamicDialog works and others don't.

Props like breakpoints, style, modal, dismissableMask, contentClass all works, but unstyled doesn't. An nothing passed through pt for the dialog component seems to work:

dialog.open(dynamicComponent, {
  props: {
      unstyled: false,
      style: {
        width: "80vw",
        maxWidth: "1440px",
      },
      breakpoints: {
        "960px": "75vw",
        "640px": "90vw",
      },
      modal: true,
      pt: {
        unstyled: false,
        closeButton: {
          class: ["my-button-class"],
        },
      },
      dismissableMask: true,
      contentClass: ["dialog__content"],
    },
    onClose: () => {
      emit("closeDialog", true);
    },
  });
});

[mertsincan]

Thanks a lot for your report. I will check it

[mertsincan]

Fixed now.

[brachkow]

This issue is still there

[molul]

Same here. I have PrimeVue 4 unstyled and I'm trying to open a responsive dynamic dialog, but breakpoints seem to do nothing. This is my code:

dialog.open(FiltersModal, {
    data: {
      user: 'primetime'
    },
    props: {
      modal: true,
      showHeader: false,
      header: 'Entrar',
      dismissableMask: true,
      style: {
        width: '90vw'
        // maxWidth: '360px'
      },
      breakpoints: {
        '320px': '200px',
        '375px': '300px',
        '425px': '400px',
        '768px': '500px',
        '1024px': '600px',
        '1440px': '700px',
        '1920px': '800px',
        '2560px': '900px',

        ms: 'w-[200px]',
        mm: 'w-[300px]',
        ml: 'w-[400px]',
        tab: 'w-[500px]',
        lt: 'w-[600px]',
        ltl: 'w-[700px]',
        dt: 'w-[800px]',
        '4k': 'w-[900px]'
      }
    }
  })

In breakpoints I've tried all those options. The second half are my Tailwind screen sizes (ms, mm, etc). Either way, I'm always getting a 90vw dialog. I've read the docs (both Dialog and DynamicDialog) but can't figure out how to make this work.

[azrulaham2020]

Hi seems to have the same issue as well. Breakpoints for dynamic dialog no longer working on version 3.53.0.