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:T16b4,"use client"; import * as React from "react"; import { Slot, Slottable } from "@radix-ui/react-slot"; type SoftColor = | "red" | "darkRed" | "green" | "lime" | "blue" | "purple" | "orange" | "yellow" | "pink" | "cyan" | "white" | "black" | "teal" | "indigo" | "coral" | "mint" | "plum"; type SizeVariant = "sm" | "default" | "lg"; interface SoftButtonProps extends Omit, "className"> { children: React.ReactNode; color?: SoftColor; size?: SizeVariant; asChild?: boolean; className?: string; } const colorMap: Record = { red: { background: "radial-gradient(120% 140% at 50% 0%, #ff6b6b 0%, #ff2d2d 42%, #c91515 100%)", foreground: "#fff", glow: "rgba(255, 45, 45, .34)", }, darkRed: { background: "radial-gradient(120% 140% at 50% 0%, #ff4545 0%, #e31212 42%, #850808 100%)", foreground: "#fff", glow: "rgba(227, 18, 18, .34)", }, green: { background: "radial-gradient(120% 140% at 50% 0%, #a8d96a 0%, #63a928 42%, #347012 100%)", foreground: "#fff", glow: "rgba(99, 169, 40, .28)", }, lime: { background: "radial-gradient(120% 140% at 50% 0%, #efff78 0%, #b8ed20 40%, #63ae00 100%)", foreground: "#101500", glow: "rgba(184, 237, 32, .32)", }, blue: { background: "radial-gradient(120% 140% at 50% 0%, #72c7ff 0%, #278ff0 42%, #1554aa 100%)", foreground: "#fff", glow: "rgba(39, 143, 240, .3)", }, purple: { background: "radial-gradient(120% 140% at 50% 0%, #d08cff 0%, #9c4cff 42%, #5a229e 100%)", foreground: "#fff", glow: "rgba(156, 76, 255, .3)", }, orange: { background: "radial-gradient(120% 140% at 50% 0%, #ffd080 0%, #ff922e 42%, #c95008 100%)", foreground: "#241100", glow: "rgba(255, 146, 46, .3)", }, yellow: { background: "radial-gradient(120% 140% at 50% 0%, #fff99a 0%, #ffdc32 42%, #c89100 100%)", foreground: "#241b00", glow: "rgba(255, 220, 50, .28)", }, pink: { background: "radial-gradient(120% 140% at 50% 0%, #ff9bdf 0%, #f04fbd 42%, #a81778 100%)", foreground: "#fff", glow: "rgba(240, 79, 189, .3)", }, cyan: { background: "radial-gradient(120% 140% at 50% 0%, #9dffff 0%, #28dce7 42%, #14828c 100%)", foreground: "#062022", glow: "rgba(40, 220, 231, .3)", }, white: { background: "radial-gradient(120% 140% at 50% 0%, #ffffff 0%, #f2f2f2 42%, #cdcdcd 100%)", foreground: "#111111", glow: "rgba(255, 255, 255, .3)", }, black: { background: "radial-gradient(120% 140% at 50% 0%, #555555 0%, #222222 42%, #000000 100%)", foreground: "#fff", glow: "rgba(0, 0, 0, .3)", }, teal: { background: "radial-gradient(120% 140% at 50% 0%, #6ee0c8 0%, #14a88e 42%, #0a6656 100%)", foreground: "#fff", glow: "rgba(20, 168, 142, .3)", }, indigo: { background: "radial-gradient(120% 140% at 50% 0%, #9aa4ff 0%, #5b5ff0 42%, #2c2a9e 100%)", foreground: "#fff", glow: "rgba(91, 95, 240, .3)", }, coral: { background: "radial-gradient(120% 140% at 50% 0%, #ffb09a 0%, #ff6f52 42%, #c43a22 100%)", foreground: "#fff", glow: "rgba(255, 111, 82, .3)", }, mint: { background: "radial-gradient(120% 140% at 50% 0%, #d4ffe6 0%, #7beeb0 42%, #2fae6c 100%)", foreground: "#062414", glow: "rgba(123, 238, 176, .3)", }, plum: { background: "radial-gradient(120% 140% at 50% 0%, #e28ad8 0%, #a8329b 42%, #5e1456 100%)", foreground: "#fff", glow: "rgba(168, 50, 155, .3)", }, }; const sizeMap: Record = { sm: "h-9 px-5 text-sm", default: "h-12 px-8 text-base", lg: "h-16 px-12 text-xl", }; const SoftButton = React.forwardRef( ({ children, color = "red", size = "default", asChild = false, className, style, ...props }, ref) => { const Comp = asChild ? Slot : "button"; const palette = colorMap[color]; return ( {asChild ? ( {children} ) : ( {children} )} ); }, ); SoftButton.displayName = "SoftButton"; export { SoftButton }; export type { SoftColor }; 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","@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"}]]}]}]]}],["$","$L50",null,{"namespace":"@clover-ui","registryDependencies":[]}]]}],null]}],["$","$L51",null,{"files":[{"path":"registry/clover-ui/soft-button.tsx","content":"$52","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]