Slide-over cart Sheet opened by a bag-count button, with scrolling lines, quantity steppers, free-shipping progress, subtotal and checkout. A store header can control its open state.
The source comes with full access.
One payment of $149 ($49 for now) opens the source right here and lets the CLI install every paid component, with lifetime updates.
pnpm dlx shadcn add @01orbital/cart-drawer-01npx shadcn add @01orbital/cart-drawer-01yarn shadcn add @01orbital/cart-drawer-01bunx --bun shadcn add @01orbital/cart-drawer-01Part of the 01orbital library. With a license, put ORBITAL_TOKEN in .env.local and the same command installs it (licensed install, pricing).
It lands at components/blocks/store/cart-drawer-01/index.tsx, as source you own and edit.
import CartDrawer01 from "@/components/blocks/store/cart-drawer-01"
export default function Example() {
return <CartDrawer01 />
}It accepts the props of the Base UI part it wraps.
npm: @phosphor-icons/react. The CLI installs them for you.
Registry pieces it installs with it:
buttonemptyprogressquantity-fieldsheetuse-cartRelated Products Carousel
Product carousel titled You may also like, with tiles showing name, color note and price, a split header with a Shop all link, and previous and next arrows below the row.
Split Art Sale Banner
Two side-by-side promotional tiles, each a full-bleed art print under a dark gradient scrim with a small label, a display headline and a Shop now button.