Command Palette

Search for a command to run...

Polar/Polar License Key

Polar License Key

Styled license key display with masking, copy functionality, and status indicators.

Open in v0Open in
Pro License
Active
XXXX-****-****-WXYZ
Activations: 2/5Expires: Jan 27, 2027
Trial License
Pending
DEMO-TRIAL-KEY1-2345-6789-0000
Expired License
Expired
EXPR-****-****-5678
Expires: Dec 28, 2025

Overview

A secure license key display component with masking, copy-to-clipboard, and status indicators. Perfect for customer portals and license delivery pages.

Installation

npx shadcn@latest add "https://elements.crfrst.dev/r/polar-license-key"

Usage

import { PolarLicenseKey } from "@/components/elements/polar-license-key";

export function LicenseSection() {
  return (
    <PolarLicenseKey
      licenseKey="XXXX-ABCD-1234-EFGH-5678-WXYZ"
      productName="Pro License"
      status="active"
      activations={{ current: 2, limit: 5 }}
      expiresAt={new Date("2025-12-31")}
    />
  );
}

Props

PropTypeDefaultDescription
licenseKeystring-The license key to display
productNamestring-Product name label
status"active" | "expired" | "revoked" | "pending""active"License status
activations{ current: number; limit: number }-Activation count
expiresAtDate | string-Expiration date
maskedbooleantrueInitially mask the key
showCopyButtonbooleantrueShow copy button
showStatusbooleantrueShow status badge
size"sm" | "md" | "lg""md"Component size
onCopy(key: string) => void-Copy callback

Features

  • Toggle key visibility (show/hide)
  • One-click copy to clipboard
  • Status badge with color coding
  • Activation count display
  • Expiration date formatting
  • Monospace font for key display