Skip to content

v2.0.0

Choose a tag to compare

View all tags
@njoguamos njoguamos released this 20 Aug 21:38
· 38 commits to main since this release
v2.0.0
65a6d4e
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

BladeUIX DaisyUI v2.0.0 introduces Card, Carousel, CarouselItem, and AvatarGroup, and updates the Avatar API. Please review the Avatar upgrade notes before updating from v1.2.0.

Installation / update

composer require bladeuix/daisyui:^2.0

Breaking changes

Avatar

  • Replace status with presence (online or offline).
  • Replace placeholder and its slotted content with abbreviation.
  • Replace slotted image markup with image-src and image-alt.
  • Use boolean rounded for circular avatars.
  • Replace <x-daisyui::avatar group> with <x-daisyui::avatar-group>.
  • Arbitrary slotted Avatar markup is no longer supported.

Upgrade Avatar usage

Image avatar

{{-- v1.x --}}
<x-daisyui::avatar>
    <div class="w-24 rounded">
        <img src="https://example.com/avatar.jpg" alt="Jane Doe" />
    </div>
</x-daisyui::avatar>

{{-- v2.0 --}}
<x-daisyui::avatar
    image-src="https://example.com/avatar.jpg"
    image-alt="Jane Doe"
    class="w-24"
/>

Presence

{{-- v1.x --}}
<x-daisyui::avatar status="online">
    <div class="w-24 rounded-full">
        <img src="https://example.com/avatar.jpg" alt="Jane Doe" />
    </div>
</x-daisyui::avatar>

{{-- v2.0 --}}
<x-daisyui::avatar
    presence="online"
    image-src="https://example.com/avatar.jpg"
    image-alt="Jane Doe"
    rounded
    class="w-24"
/>

Use presence="offline" for an offline avatar.

Placeholder

{{-- v1.x --}}
<x-daisyui::avatar placeholder>
    <div class="w-24 rounded-full bg-neutral text-neutral-content">
        <span class="text-3xl">JD</span>
    </div>
</x-daisyui::avatar>

{{-- v2.0 --}}
<x-daisyui::avatar
    abbreviation="JD"
    rounded
    class="w-24 bg-neutral text-neutral-content"
/>

A non-empty abbreviation, including "0", renders the placeholder instead of the image.

Avatar groups

{{-- v1.x --}}
<x-daisyui::avatar group class="-space-x-6">
    <x-daisyui::avatar>...</x-daisyui::avatar>
    <x-daisyui::avatar>...</x-daisyui::avatar>
</x-daisyui::avatar>

{{-- v2.0 --}}
<x-daisyui::avatar-group class="-space-x-6">
    <x-daisyui::avatar image-src="https://example.com/one.jpg" image-alt="First person" />
    <x-daisyui::avatar image-src="https://example.com/two.jpg" image-alt="Second person" />
</x-daisyui::avatar-group>

What's Changed

  • Add Aura, Avatar, and AvatarGroup.
  • Add Card with title, image, size, style, layout, and actions support.
  • Add Carousel and CarouselItem with snapping, direction, image, and optional slot-content support.

Full Changelog: v1.2.0...v2.0.0

Assets 2
Loading