Pay barhospitality
Checkout total and primary action bar, fixed on mobile and inline on desktop, with a submit-once guard.
설치
pnpm
pnpm dlx shadcn@4.23.0 add @uikit/pay-barDefault
pay-bar-demo.tsx
import { PayBar } from "@/components/ui/pay-bar";
export default function PayBarDemo() { return ( <div className="flex flex-col gap-6"> <PayBar amount={48900} currency="USD" onSubmit={() => new Promise<void>((resolve) => setTimeout(resolve, 800))}> Pay now </PayBar> <PayBar amount={48900} currency="USD" disabled disabledReason="Accept the required terms to continue" onSubmit={() => undefined}> Pay now </PayBar> </div> );}