jordanbeattie/jetstream-buttons

There is no license information available for the latest version (1.0.5) of this package.

Maintainers

Details

github.com/jordannbeattie/jetstream-buttons

Source

Issues

Installs: 104

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 1

Forks: 0

Open Issues: 0

1.0.5 2021-11-30 14:14 UTC

Requires

Unknown License 864fcf90e0fe1b50162f36346df7302b435ac4c9

This package is auto-updated.

Last update: 2024-12-29 07:06:55 UTC

README

Extending larave/jetstream buttons to make using them with livewire/livewire simpler.

Variations

All three of Jetstreams integral buttons are available:

  • Primary
  • Secondary
  • Danger

Parameters

Wrapper

Buttons containing SVG's often don't align with buttons containing text. To get around this, you can use the wrapper component to ensure consitency.

<x-buttons-wrapper>
    // buttons here
</x-buttons-wrapper>

Example

In the below example, I have three buttons to interact with a model: Save, Cancel and Delete. When one button is clicked, they are all disabled. When each button is clicked, it will show a loading icon.

<x-buttons-wrapper>
    <x-buttons-primary click="save" disable-target="cancel, delete" />
    <x-buttons-secondary click="cancel" disable-target="save, delete">Cancel</x-buttons.custom>
    <x-buttons-danger click="delete" disable-target="cancel, save" copy="delete" />
</x-buttons-wrapper>

Styling

Each button component extends Jetstream's button component. See jetstream's documentation on customisation.

Contact

Jordan Beattie
jordan@jordanbeattie.com
www.jordanbeattie.com