Getting Started
Full
Title + supporting copy + CTA. The standard empty-list state.
import { Placeholder, PrimaryButton } from "@appboxo/ui-kit"
import { PreviewLayout } from "./_section"
export function PlaceholderFullPreview() {
return (
<PreviewLayout>
<Placeholder
title="No tickets yet"
description="Your purchased lounge passes will show up here once you book one."
action={<PrimaryButton text="Browse lounges" />}
/>
</PreviewLayout>
)
}
Title only
Use for terse states where the surrounding context already explains why nothing is there.
import { Placeholder } from "@appboxo/ui-kit"
import { PreviewLayout } from "./_section"
export function PlaceholderTitleOnlyPreview() {
return (
<PreviewLayout>
<Placeholder title="Nothing here." />
</PreviewLayout>
)
}
Installation
pnpm add @appboxo/ui-kitBuild mini-apps with Boxo
Freedom UI Kit is the design system behind partner mini-apps shipping on the Boxo platform.
Learn more about Boxo