4e: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"] 4f: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"] 50:T15d4,import * as React from "react"; import { Slot } from "@radix-ui/react-slot"; import { cn } from "@/lib/utils"; type Color = | "default" | "blue" | "purple" | "pink" | "red" | "orange" | "yellow" | "green" | "teal" | "cyan" | "indigo" | "violet" | "rose" | "amber" | "lime" | "sky" | "slate" | "gray" | "zinc" | "neutral" | "stone" | "fuchsia" | "emerald"; type SizeVariant = "sm" | "default" | "lg"; interface RichButtonProps extends React.ButtonHTMLAttributes { children: React.ReactNode; color?: Color; size?: SizeVariant; className?: string; asChild?: boolean; } const colorMap: Record = { default: "from-zinc-900/85 to-zinc-900 dark:from-zinc-100/85 dark:to-zinc-100", emerald: "from-emerald-600/85 to-emerald-600 dark:from-emerald-600/75", blue: "from-blue-600/85 to-blue-600 dark:from-blue-600/75", purple: "from-purple-600/85 to-purple-600 dark:from-purple-600/75", pink: "from-pink-600/85 to-pink-600 dark:from-pink-600/75", red: "from-red-600/85 to-red-600 dark:from-red-600/75", orange: "from-orange-600/85 to-orange-600 dark:from-orange-600/75", yellow: "from-yellow-600/85 to-yellow-600 dark:from-yellow-600/75", green: "from-green-600/85 to-green-600 dark:from-green-600/75", teal: "from-teal-600/85 to-teal-600 dark:from-teal-600/75", cyan: "from-cyan-600/85 to-cyan-600 dark:from-cyan-600/75", indigo: "from-indigo-600/85 to-indigo-600 dark:from-indigo-600/75", violet: "from-violet-600/85 to-violet-600 dark:from-violet-600/75", rose: "from-rose-600/85 to-rose-600 dark:from-rose-600/75", amber: "from-amber-600/85 to-amber-600 dark:from-amber-600/75", lime: "from-lime-600/85 to-lime-600 dark:from-lime-600/75", sky: "from-sky-600/85 to-sky-600 dark:from-sky-600/75", slate: "from-slate-600/85 to-slate-600 dark:from-slate-600/75", gray: "from-gray-600/85 to-gray-600 dark:from-gray-600/75", zinc: "from-zinc-700/85 to-zinc-700 dark:from-zinc-700/75", neutral: "from-neutral-600/85 to-neutral-600 dark:from-neutral-600/75", stone: "from-stone-600/85 to-stone-600 dark:from-stone-600/75", fuchsia: "from-fuchsia-600/85 to-fuchsia-600 dark:from-fuchsia-600/75", }; const textShadowMap: Record = { default: "[text-shadow:0_1px_0_rgb(0,0,0)] dark:[text-shadow:0_1px_0_rgb(255,255,255)]", emerald: "[text-shadow:0_1px_0_var(--color-emerald-800)]", blue: "[text-shadow:0_1px_0_var(--color-blue-800)]", purple: "[text-shadow:0_1px_0_var(--color-purple-800)]", pink: "[text-shadow:0_1px_0_var(--color-pink-800)]", red: "[text-shadow:0_1px_0_var(--color-red-800)]", orange: "[text-shadow:0_1px_0_var(--color-orange-800)]", yellow: "[text-shadow:0_1px_0_var(--color-yellow-800)]", green: "[text-shadow:0_1px_0_var(--color-green-800)]", teal: "[text-shadow:0_1px_0_var(--color-teal-800)]", cyan: "[text-shadow:0_1px_0_var(--color-cyan-800)]", indigo: "[text-shadow:0_1px_0_var(--color-indigo-800)]", violet: "[text-shadow:0_1px_0_var(--color-violet-800)]", rose: "[text-shadow:0_1px_0_var(--color-rose-800)]", amber: "[text-shadow:0_1px_0_var(--color-amber-800)]", lime: "[text-shadow:0_1px_0_var(--color-lime-800)]", sky: "[text-shadow:0_1px_0_var(--color-sky-800)]", slate: "[text-shadow:0_1px_0_var(--color-slate-800)]", gray: "[text-shadow:0_1px_0_var(--color-gray-800)]", zinc: "[text-shadow:0_1px_0_var(--color-zinc-800)]", neutral: "[text-shadow:0_1px_0_var(--color-neutral-800)]", stone: "[text-shadow:0_1px_0_var(--color-stone-800)]", fuchsia: "[text-shadow:0_1px_0_var(--color-fuchsia-800)]", }; const sizeMap: Record = { sm: "h-8 rounded-md gap-1.5 px-3 text-sm", default: "h-9 px-4 py-2 text-sm rounded-md", lg: "h-10 rounded-md px-6 text-base", }; const RichButton = React.forwardRef( ( { children, color = "default", size = "default", className, asChild = false, ...props }, ref, ) => { const Comp = asChild ? Slot : "button"; const colorClasses = colorMap[color]; const textShadowClasses = textShadowMap[color]; const sizeClasses = sizeMap[size]; const textColor = color === "default" ? "text-white dark:text-zinc-900" : "text-white"; return ( {asChild ? children : typeof children === "string" ? ( {children} ) : (

{children}

)} ); }, ); RichButton.displayName = "RichButton"; export { RichButton }; 4d:["$","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","@radix-ui/react-slot",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40radix-ui%2Freact-slot","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":"@radix-ui/react-slot"}]]}]}]]}],["$","$L4e",null,{"namespace":"@spell","registryDependencies":[]}]]}],null]}],["$","$L4f",null,{"files":[{"path":"registry/spell-ui/rich-button.tsx","content":"$50","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]