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:Ta9c,"use client" import { useAnimate } from "motion/react" import type React from "react" import type { RenderProp } from "../../hooks/use-render" import { TextSplit } from "../text-split/text-split" export type TextBounceProps = { children: string pause?: number outDuration?: number inDuration?: number bounce?: number distance?: number rotation?: number render?: RenderProp } type LetterProps = { char: string } & Required< Pick< TextBounceProps, "pause" | "outDuration" | "inDuration" | "bounce" | "distance" | "rotation" > > function Letter({ char, pause, outDuration, inDuration, bounce, distance, rotation }: LetterProps) { const [scope, animate] = useAnimate() const handlePointerEnter = async (event: React.PointerEvent) => { const el = scope.current if (!el) return const rect = el.getBoundingClientRect() const cx = rect.left + rect.width / 2 const cy = rect.top + rect.height / 2 const dx = cx - event.clientX const dy = cy - event.clientY const dist = Math.sqrt(dx * dx + dy * dy) || 1 const nx = dx / dist const ny = dy / dist await animate([ [ el, { x: nx * distance, y: ny * distance, rotate: nx * rotation }, { duration: outDuration, ease: "circOut" }, ], [ el, { x: 0, y: 0, rotate: 0 }, { type: "spring", duration: inDuration, bounce, delay: pause }, ], ]) } return ( {char} ) } export function TextBounce({ children, pause = 0, outDuration = 0.35, inDuration = 0.8, bounce = 0.5, distance = 35, rotation = 25, render, }: TextBounceProps) { return ( { return ( ) }} > {children} ) } 51:Tbe7,// biome-ignore-all lint/suspicious/noExplicitAny: prop merging is inherently dynamic /** * Inspired by Base UI's `useRender` + `mergeProps`, intentionally simplified for this * library's scope at the moment. * * Chosen over polymorphic prop: cleaner TypeScript, integrates better with other * component (Next/Image, design systems, third-party UI libraries) * * @see https://base-ui.com/react/utils/use-render * @see https://base-ui.com/react/utils/merge-props */ import { cloneElement, isValidElement, type ReactElement, type Ref } from "react" type AnyProps = Record type RenderFunction = (props: AnyProps, state: S) => ReactElement export type RenderProp = ReactElement | RenderFunction type UseRenderOptions = { render: RenderProp | undefined props: AnyProps state?: S defaultElement: ReactElement } export function useRender(options: UseRenderOptions): ReactElement { const { render, props, state, defaultElement } = options const target = render ?? defaultElement // Function form: consumer wires props themselves, no merging needed. if (typeof target === "function") { return target(props, state as S) as ReactElement } // Element form: clone and merge our internal props with whatever the consumer set on the element. const targetProps = (isValidElement(target) ? target.props : {}) as AnyProps return cloneElement(target, mergeProps(props, targetProps)) as ReactElement } function mergeProps(internal: AnyProps, external: AnyProps): AnyProps { const merged: AnyProps = { ...internal } for (const key in external) { const internalValue = internal[key] const externalValue = external[key] if (key === "className" && typeof externalValue === "string") { merged[key] = [internalValue, externalValue].filter(Boolean).join(" ") } else if (key === "style" && externalValue && typeof externalValue === "object") { merged[key] = { ...internalValue, ...externalValue } } else if (key === "ref") { merged[key] = composeRefs(internalValue, externalValue) } else if ( key.startsWith("on") && typeof internalValue === "function" && typeof externalValue === "function" ) { // External handler runs first so consumers can stopPropagation before our logic fires. merged[key] = chainFunctions(externalValue, internalValue) } else { merged[key] = externalValue } } return merged } function chainFunctions(...fns: Array<(...args: any[]) => void>) { return (...args: any[]) => { for (const fn of fns) fn(...args) } } function composeRefs(...refs: Array | undefined>) { return (node: T) => { for (const ref of refs) { if (typeof ref === "function") ref(node) else if (ref != null) (ref as { current: T | null }).current = node } } } 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","motion",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","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":"motion"}]]}]}]]}],["$","$L4e",null,{"namespace":"@atelier","registryDependencies":["https://atelier-ui.com/r/text-split.json","https://atelier-ui.com/r/agent-rules.json"]}]]}],null]}],["$","$L4f",null,{"files":[{"path":"registry/text-bounce/text-bounce.tsx","content":"$50","type":"registry:component","target":"components/text-bounce/text-bounce.tsx"},{"path":"registry/hooks/use-render.ts","content":"$51","type":"registry:hook","target":"hooks/use-render.ts"}],"className":"h-[70svh] min-h-80"}]]}]