Cart

Cart components — add to cart button states, unavailable status messages, and animated transitions.

Add to cart button — status variants

Available

Sold

Shipped

Delivered

Draft

Click the “Add to cart” button to see the full animation cycle.

The add to cart button uses the real animated SlidingLabel with sliding transitions and icon animations. Click the available button to see the full add → added → in cart → remove → removed cycle. Unavailable statuses show the disabled state with a status-specific message.