bigblocks/dist-registry/components/ui-components-masterkeybadge.json

Complete Bitcoin UI component library - authentication, social, wallet, market, inscriptions, and blockchain interactions for React

{
  "name": "ui-components-masterkeybadge",
  "type": "registry:component",
  "dependencies": [
    "@radix-ui/react-icons",
    "class-variance-authority"
  ],
  "devDependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "components/ui-components/MasterKeyBadge.tsx",
      "type": "registry:component",
      "content": "import { LockClosedIcon } from \"@radix-ui/react-icons\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../lib/utils.js\";\nimport { Badge } from \"../ui/badge.js\";\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipProvider,\n\tTooltipTrigger,\n} from \"../ui/tooltip.js\";\n\nexport interface MasterKeyBadgeProps {\n\t/**\n\t * Custom tooltip message\n\t */\n\ttooltip?: string;\n\t/**\n\t * Whether to show the lock icon\n\t */\n\tshowIcon?: boolean;\n\t/**\n\t * Badge text\n\t */\n\ttext?: string;\n\t/**\n\t * Badge variant\n\t */\n\tvariant?: \"default\" | \"secondary\" | \"destructive\" | \"outline\";\n\t/**\n\t * Additional CSS classes\n\t */\n\tclassName?: string;\n}\n\n/**\n * MasterKeyBadge - Visual indicator for features that require master key access\n *\n * @example\n * ```tsx\n * <MasterKeyBadge />\n * <MasterKeyBadge tooltip=\"This feature requires signing in with your master backup\" />\n * <MasterKeyBadge text=\"Master Only\" color=\"purple\" />\n * ```\n */\nexport function MasterKeyBadge({\n\ttooltip = \"Requires master key access\",\n\tshowIcon = true,\n\ttext = \"Master Key\",\n\tvariant = \"secondary\",\n\tclassName,\n}: MasterKeyBadgeProps) {\n\tconst badge = (\n\t\t<Badge\n\t\t\tvariant={variant}\n\t\t\tclassName={cn(\n\t\t\t\t\"bg-amber-100 text-amber-900 hover:bg-amber-200\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<div className=\"flex items-center gap-1\">\n\t\t\t\t{showIcon && <LockClosedIcon className=\"h-3 w-3\" />}\n\t\t\t\t{text}\n\t\t\t</div>\n\t\t</Badge>\n\t);\n\n\tif (tooltip) {\n\t\treturn (\n\t\t\t<TooltipProvider>\n\t\t\t\t<Tooltip>\n\t\t\t\t\t<TooltipTrigger asChild>{badge}</TooltipTrigger>\n\t\t\t\t\t<TooltipContent>\n\t\t\t\t\t\t<p>{tooltip}</p>\n\t\t\t\t\t</TooltipContent>\n\t\t\t\t</Tooltip>\n\t\t\t</TooltipProvider>\n\t\t);\n\t}\n\n\treturn badge;\n}\n",
      "target": "<%- config.aliases.components %>/masterkeybadge.tsx"
    }
  ]
}