wire-elements / modal

Livewire component that provides you with a modal that supports multiple child modals while maintaining state.
MIT License
1.09k stars 129 forks source link

Updated README.md #389

Closed BoGnY closed 6 months ago

BoGnY commented 7 months ago

Added few lines to put on tailwind.config.js because dynamically classes (such as modal max width) are in wire-elements/modal/src php component file and not on resource views wire-elements/modal/resources/views, so they aren't purged.

NikarashiHatsu commented 6 months ago

Instead of doing this, it is already said that:

Because some classes are dynamically build you should add some classes to the purge safelist so your tailwind.config.js should look something like this:

module.exports = {
  purge: {
    content: [
      './vendor/wire-elements/modal/resources/views/*.blade.php',
      './storage/framework/views/*.php',
      './resources/views/**/*.blade.php',
    ],
    options: {
      safelist: [
        'sm:max-w-2xl'
      ]
    }
  },
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [],
}

So I think it is really not necessary adding the changes to the Readme file. Instead, I suggest you to change the safelist with every classes exists on ModalComponent's $maxWidths like this:

safelist: [
  'sm:max-w-sm',
  'sm:max-w-md',
  'md:max-w-lg',
  'md:max-w-xl',
  'lg:max-w-2xl',
  'lg:max-w-3xl',
  'xl:max-w-4xl',
  'xl:max-w-5xl',
  '2xl:max-w-6xl',
  '2xl:max-w-7xl',
]
BoGnY commented 6 months ago

So I think it is really not necessary adding the changes to the Readme file. Instead, I suggest you to change the safelist with every classes exists on ModalComponent's $maxWidths like this:

safelist: [
  'sm:max-w-sm',
  'sm:max-w-md',
  'md:max-w-lg',
  'md:max-w-xl',
  'lg:max-w-2xl',
  'lg:max-w-3xl',
  'xl:max-w-4xl',
  'xl:max-w-5xl',
  '2xl:max-w-6xl',
  '2xl:max-w-7xl',
]

This is completely meaningless imho... Why would I look for all the dynamically generated classes and insert them into the purgelist when tailwind automatically identifies them if added to the purge content section???????

In this case there are a low number of dynamically generated classes, but what if a package had 1000 of them??? Are you looking for all 1000 of them to add them to the safelist?!? 🤔

The purge content section is there to avoid all this and automatically identify the dynamically generated classes to keep, so let's use it 💪👍

NikarashiHatsu commented 6 months ago

Uhhh, no??? Did you take a glance at the perspectives laid out in this package? The modal_max_widths it supports are exclusively limited to the options: 'sm', 'md', 'lg', 'xl', '2xl', '3xl', '4xl', '5xl', '6xl', '7xl'. You can verify this in the config/wire-elements-modal.php file, precisely on line 37.

Given this understanding, I'm inclined to believe that the imperative classes required for the safelist can be found solely in the src/ModalComponent.php file at line 17. This particular file is the sole repository of the dynamic classes.

Now, let's ponder this: Why embark on a wild goose chase through all five files ensconced within the src folder when there's only one file that houses the very essence of those classes?

PhiloNL commented 6 months ago

I don't think there are any Tailwind classes in the PHP classes so it's not needed to add this to the list, as also mentioned above. So I'm closing this, feel free to leave a comment and tag me if you think this is incorrect. Thanks!