{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "logo", "title": "Logo", "description": "The Edgecom Logo component.", "registryDependencies": [ "edgecom-ai/design-system/theme" ], "files": [ { "path": "src/components/ui/logo.tsx", "content": "import * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\n/**\n * Edgecom Energy brand logo.\n *\n * - `combination` (default): the mark + \"EEConnect\" wordmark lockup.\n * - `mark`: the isometric mark on its own (use in collapsed rails, favicons, avatars).\n *\n * The colored (gradient) artwork is the default; in dark mode the flat-white\n * artwork is shown instead. Switching is driven by the `.dark` class on an\n * ancestor (the convention used throughout this design system), so no props are\n * needed to handle theming — just size it with `className` (e.g. `h-8 w-auto`).\n */\n\ntype LogoVariant = \"combination\" | \"mark\"\n\ninterface LogoProps extends React.HTMLAttributes {\n variant?: LogoVariant\n /** Accessible name for the logo. Set to \"\" to mark it decorative. */\n label?: string\n}\n\nfunction Logo({\n variant = \"combination\",\n label = \"Edgecom Energy\",\n className,\n ...props\n}: LogoProps) {\n const uid = React.useId()\n const Colored = variant === \"mark\" ? MarkColored : CombinationColored\n const White = variant === \"mark\" ? MarkWhite : CombinationWhite\n\n return (\n \n \n \n \n )\n}\n\n// ---------------------------------------------------------------------------\n// Combination lockup (mark + wordmark)\n// ---------------------------------------------------------------------------\n\nfunction CombinationColored({\n uid,\n className,\n}: {\n uid: string\n className?: string\n}) {\n const g = (n: number) => `${uid}-comb-${n}`\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n\nfunction CombinationWhite({ className }: { uid: string; className?: string }) {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n\n// ---------------------------------------------------------------------------\n// Mark only\n// ---------------------------------------------------------------------------\n\nfunction MarkColored({ uid, className }: { uid: string; className?: string }) {\n const g = (n: number) => `${uid}-mark-${n}`\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n )\n}\n\nfunction MarkWhite({ className }: { uid: string; className?: string }) {\n return (\n \n \n \n \n )\n}\n\nexport { Logo }\n", "type": "registry:ui" } ], "type": "registry:ui" }