Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DynamicDialog: passing pt when opening new dialogs #4443

Closed
rubjo opened this issue Sep 13, 2023 · 9 comments
Closed

DynamicDialog: passing pt when opening new dialogs #4443

rubjo opened this issue Sep 13, 2023 · 9 comments
Assignees
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@rubjo
Copy link
Contributor

rubjo commented Sep 13, 2023

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

@rubjo rubjo added Status: Discussion Issue or pull request needs to be discussed by Core Team Type: New Feature Issue contains a new feature or new component request labels Sep 13, 2023
@rubjo rubjo changed the title DynamicDialog DynamicDialog: passing pt when opening new dialogs Sep 13, 2023
@zejji
Copy link

zejji commented Sep 18, 2023

+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
Copy link

mwhit24 commented Nov 28, 2023

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
Copy link

davidphotodev commented Dec 1, 2023

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?

@DevBlacksmith
Copy link

DevBlacksmith commented Dec 8, 2023

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 mertsincan self-assigned this Dec 9, 2023
@mertsincan mertsincan added this to the 3.44.0 milestone Dec 9, 2023
@mertsincan
Copy link
Member

Thanks a lot for your report. I will check it

@mertsincan
Copy link
Member

Fixed now.

@mertsincan mertsincan added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Discussion Issue or pull request needs to be discussed by Core Team Type: New Feature Issue contains a new feature or new component request labels Dec 10, 2023
@brachkow
Copy link

brachkow commented May 1, 2024

This issue is still there

@molul
Copy link

molul commented Sep 11, 2024

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
Copy link

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

No branches or pull requests

9 participants