Skip to content

Kirby 3.9.8

Empty

<k-empty>

This UI component hasn't been finalized yet. The functionality and syntax aren't stable and might be redone in an upcoming release. Only use it at your own risk - breaking changes are likely to occur.

Whenever you have to deal with an "empty" state, such as an empty list or a search without results, you can use the k-empty component to make it a bit nicer. The component combines an icon with text in a wrapper box.

<k-empty icon="image">No images yet</k-empty>

Props

Prop Type Default Description
icon
string
Icon to show inside the box
layout
string
"list"
Layout for the box
text
string
Text to show inside the box

Slots

Slot Description
default

Events

You can bind any events to the component

<k-empty icon="image" @click="addFirst">No images yet</k-empty>

CSS classes

.k-empty