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

Docs: Command modal example doesn't prevent Firefox address bar targetting #1050

Open
3 tasks done
chris-ware opened this issue Jan 31, 2025 · 2 comments
Open
3 tasks done

Comments

@chris-ware
Copy link

Flux version

any

Livewire version

any

What is the problem?

The example of using the Command component as a modal as seen here doesn't prevent Firefox from opening the address bar as a target. Also, the x-on on the modal itself isn't even needed, as alone it does nothing.

The code snippet attached works fine in Firefox and Chrome, prevents Firefox from opening it's address bar and as an added benefit will also work on Windows, as it uses the meta key instead of specifically cmd.

Code snippets

    <flux:modal.trigger name="search" shortcut="prevent.stop.meta.k">
        <flux:input as="button" placeholder="Search..." icon="magnifying-glass" kbd="⌘K" />
    </flux:modal.trigger>

    <flux:modal name="search" variant="bare" class="w-full max-w-[30rem] my-[12vh] max-h-screen overflow-y-hidden">
        <flux:command class="border-none shadow-lg inline-flex flex-col max-h-[76vh]">
            <flux:command.input placeholder="Search..." closable />

            <flux:command.items>
                <flux:command.item icon="user-plus" kbd="⌘A">Assign to…</flux:command.item>
                <flux:command.item icon="document-plus">Create new file</flux:command.item>
                <flux:command.item icon="folder-plus" kbd="⌘⇧N">Create new project</flux:command.item>
                <flux:command.item icon="book-open">Documentation</flux:command.item>
                <flux:command.item icon="newspaper">Changelog</flux:command.item>
                <flux:command.item icon="cog-6-tooth" kbd="⌘,">Settings</flux:command.item>
            </flux:command.items>
        </flux:command>
    </flux:modal>

How do you expect it to work?

I'd like it to, out of the box, have a solution that works for all browsers and doesn't trigger any of the standard browser mechanics.

Please confirm (incomplete submissions will not be addressed)

  • I have provided easy and step-by-step instructions to reproduce the bug.
  • I have provided code samples as text and NOT images.
  • I understand my bug report will be closed if I haven't met the criteria above.
@joshhanley
Copy link
Member

@chris-ware thanks for reporting! I'm not sure what you mean by "prevent Firefox from opening the address bar". Can you explain what you mean by that and include a screen-capture of what is happening so we can see what you are talking about? Thanks!

@chris-ware
Copy link
Author

@joshhanley This is what I'm referring to. This is the default behaviour of Firefox when using Cmd + K as a shortcut.

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants