50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:Tc1d,"use client"; import { cva, type VariantProps } from "class-variance-authority"; import * as React from "react"; import { cn } from "@/lib/utils"; import { getContrastColor, getLuminance, parseColor, } from "@/lib/utils/colorUtils"; const buttonVariants = cva( "inline-flex items-center justify-center dark:bg-zinc-500 dark:text-white whitespace-nowrap text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 relative bg-primary text-primary-foreground hover:bg-primary/90 border border-primary/50 shadow-md before:absolute before:inset-0 before:border-t before:border-white/40 before:bg-gradient-to-b before:from-white/20 before:to-transparent cursor-pointer transition-transform duration-200 active:scale-[0.96] subpixel-antialiased gap-2", { variants: { variant: { default: "", }, size: { default: "h-10 px-4 py-2 rounded-xl before:rounded-xl", sm: "h-9 rounded-lg px-3 before:rounded-xl", lg: "h-11 rounded-lg px-8 before:rounded-lg", icon: "h-10 w-10", }, }, defaultVariants: { variant: "default", size: "default", }, }, ); export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps { color?: string; } const RaisedButton = React.forwardRef( ({ className, variant, size, color, style = {}, ...props }, ref) => { const Comp = "button"; const dynamicStyles = React.useMemo(() => { if (!color) return {}; try { const rgb = parseColor(color); if (!rgb) return {}; const luminance = getLuminance(rgb); const textColor = getContrastColor(luminance); const borderOpacity = 0.5; const hoverOpacity = 0.9; const whiteBorderOpacity = 0.6; const whiteGradientOpacity = 0.3; const shadowOpacity = 0.2; const shadowSpread = "0px"; const shadowBlur = "5px"; return { backgroundColor: color, color: textColor, borderColor: `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${borderOpacity})`, "--hover-bg": `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${hoverOpacity})`, "--border": `rgba(255, 255, 255, ${whiteBorderOpacity})`, "--gradient": `rgba(255, 255, 255, ${whiteGradientOpacity})`, "--shadow-color": `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${shadowOpacity})`, boxShadow: `0 4px ${shadowBlur} ${shadowSpread} var(--shadow-color)`, transition: "all 0.2s ease-in-out", }; } catch (e) { console.error("Error processing color:", e); return {}; } }, [color]); const computedClassName = cn( buttonVariants({ variant, size, className }), color && "hover:bg-[color:var(--hover-bg)] before:border-[color:var(--border)] before:from-[color:var(--gradient)] hover:opacity-80 overflow-hidden", ); return ( ); }, ); RaisedButton.displayName = "RaisedButton"; export { buttonVariants, RaisedButton }; 53:T1300,const CSS_COLOR_NAMES: Record = { black: [0, 0, 0], white: [255, 255, 255], red: [255, 0, 0], green: [0, 128, 0], blue: [0, 0, 255], yellow: [255, 255, 0], cyan: [0, 255, 255], magenta: [255, 0, 255], gray: [128, 128, 128], grey: [128, 128, 128], orange: [255, 165, 0], purple: [128, 0, 128], pink: [255, 192, 203], brown: [165, 42, 42], navy: [0, 0, 128], teal: [0, 128, 128], olive: [128, 128, 0], maroon: [128, 0, 0], silver: [192, 192, 192], lime: [0, 255, 0], aqua: [0, 255, 255], fuchsia: [255, 0, 255], }; export function hexToRgb( hex: string, ): { r: number; g: number; b: number } | null { const normalizedHex = hex.charAt(0) === "#" ? hex.substring(1) : hex; if (normalizedHex.length === 3) { const r = parseInt(normalizedHex.charAt(0) + normalizedHex.charAt(0), 16); const g = parseInt(normalizedHex.charAt(1) + normalizedHex.charAt(1), 16); const b = parseInt(normalizedHex.charAt(2) + normalizedHex.charAt(2), 16); return { r, g, b }; } if (normalizedHex.length === 6) { const r = parseInt(normalizedHex.substring(0, 2), 16); const g = parseInt(normalizedHex.substring(2, 4), 16); const b = parseInt(normalizedHex.substring(4, 6), 16); return { r, g, b }; } if (normalizedHex !== hex) { try { const tempElement = document.createElement("div"); tempElement.style.color = hex; document.body.appendChild(tempElement); const computedColor = window.getComputedStyle(tempElement).color; document.body.removeChild(tempElement); const rgbMatch = computedColor.match( /rgba?$(\d+),\s*(\d+),\s*(\d+)(?:,\s*[\d.]+)?$/, ); if (rgbMatch) { return { r: parseInt(rgbMatch[1], 10), g: parseInt(rgbMatch[2], 10), b: parseInt(rgbMatch[3], 10), }; } } catch (e) { console.error("Error processing color name:", e); } } return null; } export function getLuminance(rgb: { r: number; g: number; b: number }): number { const { r, g, b } = rgb; const sR = r / 255; const sG = g / 255; const sB = b / 255; const R = sR <= 0.03928 ? sR / 12.92 : ((sR + 0.055) / 1.055) ** 2.4; const G = sG <= 0.03928 ? sG / 12.92 : ((sG + 0.055) / 1.055) ** 2.4; const B = sB <= 0.03928 ? sB / 12.92 : ((sB + 0.055) / 1.055) ** 2.4; return 0.2126 * R + 0.7152 * G + 0.0722 * B; } export function getContrastColor(luminance: number): string { return luminance > 0.5 ? "#000000" : "#ffffff"; } export function parseColor( color: string, ): { r: number; g: number; b: number } | null { const hexResult = hexToRgb(color); if (hexResult) return hexResult; try { if (typeof document !== "undefined") { const tempElement = document.createElement("div"); tempElement.style.color = color; document.body.appendChild(tempElement); const computedColor = window.getComputedStyle(tempElement).color; document.body.removeChild(tempElement); const rgbMatch = computedColor.match( /rgba?$(\d+),\s*(\d+),\s*(\d+)(?:,\s*[\d.]+)?$/, ); if (rgbMatch) { return { r: parseInt(rgbMatch[1], 10), g: parseInt(rgbMatch[2], 10), b: parseInt(rgbMatch[3], 10), }; } } else { const colorMap: Record = {}; for (const [name, rgb] of Object.entries(CSS_COLOR_NAMES)) { const [r, g, b] = rgb; colorMap[name.toLowerCase()] = { r, g, b }; } const normalizedColorName = color.toLowerCase().trim(); if (colorMap[normalizedColorName]) { return colorMap[normalizedColorName]; } } const rgbDirectMatch = color.match( /rgba?$(\d+),\s*(\d+),\s*(\d+)(?:,\s*[\d.]+)?$/, ); if (rgbDirectMatch) { return { r: parseInt(rgbDirectMatch[1], 10), g: parseInt(rgbDirectMatch[2], 10), b: parseInt(rgbDirectMatch[3], 10), }; } const hslMatch = color.match( /hsla?$(\d+),\s*(\d+)%,\s*(\d+)%(?:,\s*[\d.]+)?$/, ); if (hslMatch) { const h = parseInt(hslMatch[1], 10) / 360; const s = parseInt(hslMatch[2], 10) / 100; const l = parseInt(hslMatch[3], 10) / 100; return hslToRgb(h, s, l); } } catch (e) { console.error("Error processing color:", e); } return null; } export function hslToRgb( h: number, s: number, l: number, ): { r: number; g: number; b: number } { let r: number, g: number, b: number; if (s === 0) { r = g = b = l * 255; } else { const hue2rgb = (p: number, q: number, t: number): number => { if (t < 0) t += 1; if (t > 1) t -= 1; if (t < 1 / 6) return p + (q - p) * 6 * t; if (t < 1 / 2) return q; if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6; return p; }; const q = l < 0.5 ? l * (1 + s) : l + s - l * s; const p = 2 * l - q; r = hue2rgb(p, q, h + 1 / 3) * 255; g = hue2rgb(p, q, h) * 255; b = hue2rgb(p, q, h - 1 / 3) * 255; } return { r: Math.round(r), g: Math.round(g), b: Math.round(b), }; } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","class-variance-authority",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/class-variance-authority","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"class-variance-authority"}]]}]}]]}],["$","$L50",null,{"namespace":"@gaia","registryDependencies":[]}]]}],null]}],["$","$L51",null,{"files":[{"path":"registry/new-york/ui/raised-button.tsx","content":"$52","type":"registry:ui"},{"path":"lib/utils/colorUtils.ts","content":"$53","type":"registry:lib"}],"className":"h-[70svh] min-h-80"}]]}]