Booking Status Badge

Overview

BookingStatusBadge renders a color-coded badge for each booking status. It supports three sizes and uses semantic colors to visually differentiate between pending, confirmed, completed, cancelled, and no-show states.

Usage

import { BookingStatusBadge } from "@leanicon/web-builder-library/saas";

<BookingStatusBadge status="confirmed" />;
<BookingStatusBadge status="pending" size="lg" />;

Variants

Confirmed

Pending

Completed

Cancelled

No Show

Small Size

Large Size

All Statuses (Dark)