Introduce x-hide and x-unless to avoid more javascript in CSP mode

[kg-currenxie]

Moving things to a Alpine.data() directive is already alot of work converting a whole codebase to being CSP compatible.

But even these don't work x-show="!isLeftSidebarOpen". a x-hide="isLeftSidebarOpen" would be so nice, and the negation of x-if as well.
and it feels so unnecessary to add another getter just to negate a property

Alpine.data('sidebar', () => {
  return {
    isLeftSidebarOpen: false
    get isLeftSidebarCollapsed() {
      return !this.isLeftSidebarOpen 🙄
    }, 

i feel like a new alpine attribute like this wouldn't rly "pollute" the library etc, just adds convenience. i understand omitting it when building alpine and without taking CSP into consideration, but i think this is a good enough use case, with more and more people asking for an improved CSP experience :) thanks

[ekwoka]

I think I'd be more partial to just a modifier on x-show for not

x-show.not="leftSideIsOpen" seems a bit nicer.

[kg-currenxie]

Also nice!

[kg-currenxie]

How do these feature ideas evolve into work? :) Does someone need to accept this discussion idea, then turn into an issue/re-label it, or is any PR welcome?

[ekwoka]

All PRs are welcome.

Caleb only really looks at PRs.

I am not officially a part of the alpine team, but I look at everything and try to help provide input and guidance. Of course, I do not have special knowledge about what Caleb would prefer or not, so my suggestions come with just the context of being around, helping people, and working in Alpine constantly, not from some grander vision of the goals of the project (or how it works with Livewire).

[kg-currenxie]

Alright, thanks :) 👍 I'll try to see if I can understand how to create new modifiers :)

[cadolphs]

Hi! Not sure what the progress is on all this, but I wondered whether, as an alternative to new directives or modifiers, we could just add support for (simple?) negated expressions directly in the CSP evaluator.

I took the liberty to create a PR along those lines here: #4441

That way, instead of x-hide="hideMe" you can do x-show="!hideMe".

[cadolphs]

Note, that PR's been up for quite some time with no additional feedback. It's pretty simple really but would be nice to know if it would eventually get merged or not.