juno-w

Step 1

Set to at least v3.0.6 and make sure Livewire is updated to v2.5.0

Run artisan vendor:publish --force --tag=livewire:assets --ansi to publish new assets.

Ignore if you have set auto publish at the composer's post-autoload-dump section.

Update the Alpine.js version.

juno-w

<div>
  <div class="flex items-center px-1 bg-white border border-gray-300 rounded-md">
    <div class="flex flex-wrap items-center flex-1 py-1 space-x-1">
      <template x-for="(recipient, index) in recipients">
        <div x-bind:class="{
              'bg-blue-100 rounded-full': recipient.valid,
              'border-b border-dashed border-red-500': !recipient.valid
            }" class="inline px-2 py-px text-sm text-gray-800 ">
          <span x-text="recipient.email"></span>
          <button x-on:click.prevent="removeEmail(index)" class="text-gray-700 focus:outline-none hover:text-red-500">&times;</button>

juno-w

@if ($paginator->hasPages())
    <nav role="navigation" aria-label="Pagination Navigation" class="flex justify-between">
        {{-- Previous Page Link --}}
        @if ($paginator->onFirstPage())
            <span class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md">
                {!! __('pagination.previous') !!}
            </span>
        @else
            <button type="button" wire:click="previousPage" rel="prev" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150">
                {!! __('pagination.previous') !!}