{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "priceicon",
"type": "registry:component",
"title": "PriceIcon",
"description": "Componente Concorde PriceIcon — un solo archivo, PriceIcon.tsx.",
"dependencies": [
"react"
],
"registryDependencies": [],
"files": [
{
"path": "components/PriceIcon.tsx",
"type": "registry:file",
"target": "components/PriceIcon.tsx",
"content": "\"use client\";\n\n/**\n * PriceIcon — Generado por Concorde\n * Fuente: Figma VOYAGER · \"PriceIcon\" (Size=Small|Medium, State=Default|Expirada|Skeleton)\n * Nodos: 231:912 (md default) · 235:581 (md expirada) · 232:1204 (sm default) · 235:574 (sm expirada)\n * Sincronizado: 2026-06-12\n *\n * Gema de subasta (diamante + medallón con $). Ícono estático — sin interacción.\n * Figma manda en lo visual; aquí no hay capa de interacción.\n */\n\nimport { useId } from \"react\";\nimport type { JSX } from \"react\";\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type PriceIconSize = \"sm\" | \"md\";\nexport type PriceIconState = \"default\" | \"expirada\" | \"skeleton\";\n\nexport interface PriceIconProps {\n size?: PriceIconSize;\n state?: PriceIconState;\n className?: string;\n /** Texto accesible (default: \"Precio\") */\n title?: string;\n}\n\n// ─── Gema DEFAULT (con gradientes teal→vault + medallón $) ──────────────────────\n\nfunction GemDefaultMd({ uid }: { uid: string }): JSX.Element {\n return (\n \n );\n}\n\nfunction GemDefaultSm({ uid }: { uid: string }): JSX.Element {\n return (\n \n );\n}\n\n// ─── Gema EXPIRADA (gris #E1E3E2 + $ blanco) ────────────────────────────────────\n\nfunction GemExpiradaMd({ uid }: { uid: string }): JSX.Element {\n return (\n \n );\n}\n\nfunction GemExpiradaSm({ uid }: { uid: string }): JSX.Element {\n return (\n \n );\n}\n\n// ─── Skeleton (círculo gris) ────────────────────────────────────────────────────\n\nfunction GemSkeleton({ size }: { size: PriceIconSize }): JSX.Element {\n if (size === \"sm\") {\n return (\n \n );\n }\n return (\n \n );\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport default function PriceIcon({\n size = \"md\",\n state = \"default\",\n className = \"\",\n title = \"Precio\",\n}: PriceIconProps): JSX.Element {\n const uid = useId().replace(/:/g, \"-\");\n\n function renderGem(): JSX.Element {\n if (state === \"skeleton\") return ;\n if (state === \"expirada\") return size === \"sm\" ? : ;\n return size === \"sm\" ? : ;\n }\n\n return (\n \n {renderGem()}\n \n );\n}\n"
}
]
}