4d: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4e: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"ItemStyles"] 4f:I[34002,["/_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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"CodeEditor"] 50: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 51:Ta93,"use client"; import * as React from "react"; import { useMorph } from "@/lib/cojeev-motion/use-morph"; import { cva } from "class-variance-authority"; import { cn } from "@/lib/utils"; import * as Primitive from "@radix-ui/react-hover-card"; import { useFlowAppearance } from "@/lib/cojeev-motion/use-flow"; import { ScrollArea } from "@/components/ui/scroll-area"; export type HoverCardProps = React.ComponentProps; export function HoverCard(props: HoverCardProps) { return ; } export type HoverCardTriggerProps = React.ComponentProps< typeof Primitive.Trigger >; export function HoverCardTrigger(props: HoverCardTriggerProps) { return ( ); } export type HoverCardPortalProps = React.ComponentProps< typeof Primitive.Portal >; export function HoverCardPortal(props: HoverCardPortalProps) { return ; } export const hoverCardContentVariants = cva( "v-popover [background:var(--popover)] [border-radius:var(--r-card)] [padding:var(--s-5)] [box-shadow:var(--shadow-float)] [border:1px_solid_var(--v-border)]", ); export type HoverCardContentProps = React.ComponentProps< typeof Primitive.Content > & { portal?: boolean; appearance?: "identity" | "preview" | "media"; scrollable?: boolean; }; export function HoverCardContent({ className, ref, children, sideOffset = 8, align = "start", collisionPadding = 8, portal = true, appearance, scrollable = !!appearance, ...props }: HoverCardContentProps) { const morphRef = useMorph("surfaces", ref); const flowRef = useFlowAppearance(true, morphRef, "grow"); const ownsScroll = scrollable && !props.asChild; const content = ( {ownsScroll ? ( {children} ) : ( children )} ); return portal ? {content} : content; } 52:Td1a,@layer cojeev-states { /* Cojeev authored subparts, state precedence, and irreducible shapes; scoped to this registry item. */ @media (prefers-reduced-motion: reduce) { [data-slot="hover-card"], [data-slot^="hover-card-"], [data-slot="hover-card"]::before, [data-slot="hover-card"]::after, [data-slot^="hover-card-"]::before, [data-slot^="hover-card-"]::after { animation-duration: 0s; animation-iteration-count: 1; transition-duration: 0s; scroll-behavior: auto; } } [data-slot="hover-card-content"], [data-slot="hover-card-sub-content"] { min-width: min(200px, calc(100vw - 24px)); max-width: calc(100vw - 24px); max-height: min( 480px, var(--radix-hover-card-content-available-height, calc(100dvh - 32px)) ); overflow-y: auto; overscroll-behavior: contain; overflow-wrap: anywhere; } [data-slot="hover-card-item"] { min-width: 0; height: auto; min-height: 36px; white-space: normal; } [data-slot="hover-card-content"] { z-index: var(--z-popover); } [data-slot="hover-card-content"][data-appearance] { --mfill: var(--v-paper); --mstroke: var(--v-border); border-radius: 18px; width: min(340px, calc(100vw - 24px)); color: var(--v-text); border: 0; isolation: isolate; } [data-slot="hover-card-content"][data-appearance].v-morph-live { background: transparent; } [data-slot="hover-card-content"][data-scrollable] { overflow: visible; padding: 0; } .v-hovercard-scroll[data-slot="scroll-area"] { --h: min( 440px, var(--radix-hover-card-content-available-height, calc(100dvh - 32px)) ); } .v-hovercard-scroll.v-scroll.-plain[data-slot="scroll-area"] > [data-slot="scroll-area-viewport"] { padding: 22px 28px 22px 22px; } .v-hovercard-detail { display: grid; gap: 15px; } .v-hovercard-detail h3 { margin: 0; font-family: var(--font-display); font-size: 22px; line-height: 1.25; } .v-hovercard-detail p { margin: 0; font-size: 13px; line-height: 1.65; color: var(--v-text-2); } .v-hovercard-detail__top { display: flex; align-items: center; gap: 14px; } .v-hovercard-detail__meta { display: block; font-size: 11px; color: var(--v-text-3); letter-spacing: 0.04em; } .v-hovercard-detail__excerpt { border-left: 3px solid var(--v-pink); padding-left: 13px; } .v-hovercard-detail__art { width: 100%; height: auto; display: block; border-radius: 10px; } .v-hovercard-detail__footer { border-top: 1px solid var(--v-edge); padding-top: 12px; display: flex; justify-content: space-between; gap: 12px; } .v-hovercard-example { display: grid; gap: 22px; width: 100%; max-width: 580px; margin-inline: auto; padding: 24px; background: var(--v-paper); border: 1px solid var(--v-edge); border-radius: 22px; color: var(--v-text); } .v-hovercard-example h3 { font-family: var(--font-display); margin: 0; font-size: 28px; line-height: 1.25; } .v-hovercard-example p { margin: 0; line-height: 1.6; } .v-hovercard-example > .v-btn { justify-self: start; } .v-hovercard-inline[data-slot="collapsible-content"] { padding: 0; background: transparent; } .v-hovercard-inline [data-disclosure-inner] { padding: 22px 0 0; } .v-hovercard-example__actions { display: flex; flex-wrap: wrap; gap: 10px; } .v-hovercard-example [data-slot="hover-card-trigger"] { min-height: 44px; } } 4c:["$","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"}]]}]}],["$","li","@radix-ui/react-hover-card",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40radix-ui%2Freact-hover-card","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-hover-card"}]]}]}]]}],["$","$L4d",null,{"namespace":"@000h-cojeev","registryDependencies":["https://000h.cojeev.com/r/cojeev.json","https://000h.cojeev.com/r/scroll-area.json"]}]]}],["$","$L4e",null,{"children":["$","div",null,{"className":"@container","children":["$","div",null,{"className":"grid grid-cols-1 gap-4 @xl:grid-cols-2","children":[null,null,null,["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"CSS"}],["$","div",null,{"children":["$","$L4f",null,{"lang":"css","copyButton":true,"writing":false,"className":"rounded-none w-full max-h-80","header":false,"children":"@import \"@/styles/cojeev/hover-card.css\" {\n\n}"}]}]]}]]}]}]}]]}],["$","$L50",null,{"files":[{"path":"registry/cojeev/ui/hover-card.tsx","content":"$51","type":"registry:ui"},{"path":"registry/cojeev/styles/hover-card.css","content":"$52","type":"registry:file","target":"styles/cojeev/hover-card.css"}],"className":"h-[70svh] min-h-80"}]]}]