51: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"] 52: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"] 53:Tc63,/* @jsxImportSource @opentui/react */ export type GradientName = | "cristal" | "teen" | "mind" | "morning" | "vice" | "passion" | "fruit" | "instagram" | "atlas" | "retro" | "summer" | "pastel" | "rainbow"; const GRADIENT_PRESETS: Record = { atlas: ["#feac5e", "#c779d0", "#4bc0c8"], cristal: ["#bdfff3", "#4ac29a"], fruit: ["#ff4e50", "#f9d423"], instagram: ["#833ab4", "#fd1d1d", "#fcb045"], mind: ["#473b7b", "#3584a7", "#30d2be"], morning: ["#ff5f6d", "#ffc371"], passion: ["#f43b47", "#453a94"], pastel: ["#74ebd5", "#9face6"], rainbow: ["#ff0000", "#ff7700", "#ffff00", "#00ff00", "#0000ff", "#8b00ff"], retro: [ "#3f51b1", "#5a55ae", "#7b5fac", "#8f6aae", "#a86aa4", "#cc6b8e", "#f18271", "#f3a469", "#f7c978", ], summer: ["#22c1c3", "#fdbb2d"], teen: ["#77a1d3", "#79cbca", "#e684ae"], vice: ["#5ee7df", "#b490ca"], }; export interface GradientProps { children: string; name?: GradientName; colors?: string[]; bold?: boolean; } interface RGB { r: number; g: number; b: number; } const parseHex = (hex: string): RGB => { const clean = hex.replace("#", ""); const full = clean.length === 3 ? [...clean].map((c) => c + c).join("") : clean; return { b: Number.parseInt(full.slice(4, 6), 16), g: Number.parseInt(full.slice(2, 4), 16), r: Number.parseInt(full.slice(0, 2), 16), }; }; const toHex = ({ r, g, b }: RGB): string => `#${[r, g, b] .map((v) => Math.round(Math.max(0, Math.min(255, v))) .toString(16) .padStart(2, "0") ) .join("")}`; const lerpColor = (a: RGB, b: RGB, t: number): RGB => ({ b: a.b + (b.b - a.b) * t, g: a.g + (b.g - a.g) * t, r: a.r + (b.r - a.r) * t, }); export interface GradientChar { char: string; color: string; } export const gradientText = ( text: string, colors: string[] ): GradientChar[] => { if (colors.length === 0) { return [...text].map((char) => ({ char, color: "" })); } if (colors.length === 1) { return [...text].map((char) => ({ char, color: colors[0] })); } const parsedColors = colors.map(parseHex); const segments = colors.length - 1; const len = text.length; return [...text].map((char, i) => { if (len <= 1) { return { char, color: colors[0] }; } const pos = (i / (len - 1)) * segments; const segIndex = Math.min(Math.floor(pos), segments - 1); const t = pos - segIndex; const color = toHex( lerpColor(parsedColors[segIndex], parsedColors[segIndex + 1], t) ); return { char, color }; }); }; export const Gradient = ({ children, name, colors, bold = false, }: GradientProps) => { const resolvedColors = colors ?? (name ? GRADIENT_PRESETS[name] : []); const chars = gradientText(children, resolvedColors); return ( {chars.map((item, idx) => bold ? ( {item.char} ) : ( {item.char} ) )} ); }; 50:["$","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","@opentui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40opentui%2Freact","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":"@opentui/react"}]]}]}]]}],["$","$L51",null,{"namespace":"@termcn","registryDependencies":[]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/opentui/ui/gradient.tsx","content":"$53","type":"registry:ui","target":"components/ui/gradient.tsx"}],"className":"h-[70svh] min-h-80"}]]}]