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[544296,["/_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"],"ItemStyles"] 52:I[8513,["/_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"],"ScrollArea"] 53:I[8513,["/_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"],"ScrollBar"] 54: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"] 55:T1025,import * as React from "react"; import { cn } from "@/lib/utils"; import "./shy-heart.css"; type ShyHeartTimingValue = number | string; type ShyHeartLengthValue = number | string; type ShyHeartStyle = React.CSSProperties & { "--shy-heart-duration"?: string; "--shy-heart-size"?: string; "--shy-heart-tilt-duration"?: string; }; export type ShyHeartProps = Omit< React.ComponentProps<"span">, "children" > & { /** Enable the heart entrance and hover reaction. Defaults to true. */ animated?: boolean; /** Entrance duration. Numeric values are converted to ms. */ duration?: ShyHeartTimingValue; /** Heart width. Numeric values are converted to px. Defaults to 64px. */ size?: ShyHeartLengthValue; /** Hover-tilt duration. Numeric values are converted to ms. */ tiltDuration?: ShyHeartTimingValue; /** Accessible label. Omit for a decorative heart. */ label?: string; /** Classes applied to the outlined heart body. */ heartClassName?: string; /** Classes applied to both three-line blush groups. */ blushClassName?: string; }; export function ShyHeart({ animated = true, "aria-hidden": ariaHidden, "aria-label": ariaLabel, blushClassName, className, duration, heartClassName, label, ref, size, style, tiltDuration, ...props }: ShyHeartProps) { const accessibleLabel = label ?? ariaLabel; const shyHeartStyle: ShyHeartStyle = { ...style }; if (duration !== undefined) { shyHeartStyle["--shy-heart-duration"] = toCssTime(duration); } if (size !== undefined) { shyHeartStyle["--shy-heart-size"] = toCssLength(size); } if (tiltDuration !== undefined) { shyHeartStyle["--shy-heart-tilt-duration"] = toCssTime(tiltDuration); } return ( ); } function toCssTime(value: ShyHeartTimingValue) { return typeof value === "number" ? `${value}ms` : value; } function toCssLength(value: ShyHeartLengthValue) { return typeof value === "number" ? `${value}px` : value; } 56:T11cd,/* Defaults are layered for customization. Normal unlayered styles and utilities in a later layer can override them. */ @layer components { .shy-heart { --shy-heart-size: 64px; --shy-heart-duration: 240ms; --shy-heart-tilt-duration: 220ms; --shy-heart-ease-out: cubic-bezier(0.23, 1, 0.32, 1); --shy-heart-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1); --shy-heart-blush-color: var(--ericts-shy-heart-blush); --shy-heart-blush-backdrop-color: var( --ericts-shy-heart-blush-baseline ); width: var(--shy-heart-size); } .shy-heart-svg { display: block; } .shy-heart-motion-stage, .shy-heart-figure, .shy-heart-blush { transform-box: view-box; } .shy-heart-motion-stage { transform-origin: 52% 72%; } .shy-heart-figure, .shy-heart-blush { transform-origin: center; } .shy-heart-body { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 16; } .shy-heart-blush { color: var(--shy-heart-blush-color); fill: none; stroke-linecap: round; stroke-linejoin: round; } .shy-heart-blush-backdrop { stroke: var(--shy-heart-blush-backdrop-color); stroke-width: 18; opacity: 0.36; } .shy-heart-blush-lines { stroke: currentColor; stroke-width: 6; } .shy-heart[data-animated] .shy-heart-motion-stage { transition: transform var(--shy-heart-tilt-duration) var(--shy-heart-ease-in-out); } .shy-heart[data-animated] .shy-heart-figure { animation: shy-heart-arrive var(--shy-heart-duration) var(--shy-heart-ease-out) both; } .shy-heart[data-animated] .shy-heart-blush { opacity: 0; transform: translateY(2%) scale(0.96); transition: opacity 180ms var(--shy-heart-ease-out), transform 180ms var(--shy-heart-ease-out); } .shy-heart[data-animated]:focus-visible .shy-heart-motion-stage { transform: translate(-1%, 1%) rotate(-8deg); } .shy-heart[data-animated]:focus-visible .shy-heart-blush { opacity: 1; transform: translateY(0) scale(1); transition-delay: 90ms; } .shy-heart[data-animated]:active .shy-heart-motion-stage { transform: translate(-1%, 1%) rotate(-8deg) scale(0.96); transition-duration: 140ms; } .shy-heart[data-animated]:active .shy-heart-blush { opacity: 1; transform: translateY(0) scale(1); transition-delay: 0ms; transition-duration: 140ms; } @keyframes shy-heart-arrive { from { opacity: 0.64; transform: translateY(2%) scale(0.96); } 72% { opacity: 1; transform: translateY(0) scale(1.025, 0.985); } to { opacity: 1; transform: translateY(0) scale(1); } } @media (hover: hover) and (pointer: fine) { .shy-heart[data-animated]:hover .shy-heart-motion-stage { transform: translate(-1%, 1%) rotate(-8deg); will-change: transform; } .shy-heart[data-animated]:hover .shy-heart-blush { opacity: 1; transform: translateY(0) scale(1); transition-delay: 90ms; } } @keyframes shy-heart-fade { from { opacity: 0.64; } to { opacity: 1; } } } /* Motion guards override ordinary customization, including inline timing. Keep these outside the defaults layer; only motion declarations are important. */ @media (prefers-reduced-motion: reduce) { .shy-heart[data-animated] .shy-heart-figure { animation-name: shy-heart-fade !important; } .shy-heart[data-animated] .shy-heart-motion-stage { transition: none !important; } .shy-heart[data-animated] .shy-heart-blush { transform: none !important; transition: opacity 160ms var(--shy-heart-ease-out) !important; } .shy-heart[data-animated]:focus-visible .shy-heart-motion-stage { transform: none !important; } .shy-heart[data-animated]:active .shy-heart-motion-stage { transform: none !important; } .shy-heart[data-animated]:focus-visible .shy-heart-blush { transform: none !important; transition-delay: 0ms !important; } .shy-heart[data-animated]:active .shy-heart-blush { transform: none !important; transition-delay: 0ms !important; } } @media (prefers-reduced-motion: reduce) and (hover: hover) and (pointer: fine) { .shy-heart[data-animated]:hover .shy-heart-motion-stage { transform: none !important; will-change: auto; } .shy-heart[data-animated]:hover .shy-heart-blush { transform: none !important; transition-delay: 0ms !important; } } 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":[null,["$","$L50",null,{"namespace":"@ericts","registryDependencies":[]}]]}],["$","$L51",null,{"children":["$","div",null,{"className":"@container","children":["$","div",null,{"className":"grid grid-cols-1 gap-4 @xl:grid-cols-2","children":[["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"Light Mode"}],["$","div",null,{"children":["$","$L52",null,{"type":"always","className":"h-80 px-2","children":[["$","div",null,{"className":"gap-2 pb-8 flex flex-col pt-4","children":[["$","div","ericts-shy-heart-blush",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","ericts-shy-heart-blush",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"oklch(0.82 0.1 10)"}}],["$","p",null,{"children":"oklch(0.82 0.1 10)"}]]}]}]]}],["$","div","ericts-shy-heart-blush-baseline",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","ericts-shy-heart-blush-baseline",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"oklch(0.82 0.1 10)"}}],["$","p",null,{"children":"oklch(0.82 0.1 10)"}]]}]}]]}]]}],["$","$L53",null,{"orientation":"horizontal"}]]}]}]]}],["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"Dark Mode"}],["$","div",null,{"children":["$","$L52",null,{"type":"always","className":"h-80 px-2","children":[["$","div",null,{"className":"gap-2 pb-8 flex flex-col pt-4","children":[["$","div","ericts-shy-heart-blush",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","ericts-shy-heart-blush",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"oklch(0.82 0.1 10)"}}],["$","p",null,{"children":"oklch(0.82 0.1 10)"}]]}]}]]}],["$","div","ericts-shy-heart-blush-baseline",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","ericts-shy-heart-blush-baseline",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"oklch(0.82 0.1 10)"}}],["$","p",null,{"children":"oklch(0.82 0.1 10)"}]]}]}]]}]]}],["$","$L53",null,{"orientation":"horizontal"}]]}]}]]}],null,null]}]}]}]]}],["$","$L54",null,{"files":[{"path":"registry/base/ui/shy-heart.tsx","content":"$55","type":"registry:ui","target":"@ui/shy-heart.tsx"},{"path":"registry/base/ui/shy-heart.css","content":"$56","type":"registry:file","target":"@ui/shy-heart.css"}],"className":"h-[70svh] min-h-80"}]]}]