{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "marquee",
	"type": "registry:component",
	"description": "Animated marquee component for horizontally or vertically scrolling content",
	"files": [
		{
			"content": "<script lang=\"ts\">\n\timport { cn } from \"$UTILS$\";\n\timport type { Snippet } from \"svelte\";\n\n\ttype MarqueeProps = {\n\t\tpauseOnHover?: boolean;\n\t\tvertical?: boolean;\n\t\trepeat?: number;\n\t\treverse?: boolean;\n\t\tclass?: string;\n\t\tchildren?: Snippet;\n\t};\n\tlet {\n\t\tpauseOnHover = false,\n\t\tvertical = false,\n\t\trepeat = 4,\n\t\treverse = false,\n\t\tclass: _class = \"\",\n\t\tchildren,\n\t}: MarqueeProps = $props();\n</script>\n\n<div\n\tclass={cn(\n\t\t\"group flex gap-(--gap) overflow-hidden p-2 [--duration:16s] [--gap:3rem]\",\n\t\t{\n\t\t\t\"flex-row\": !vertical,\n\t\t\t\"flex-col\": vertical,\n\t\t},\n\t\t_class\n\t)}\n>\n\t{#each { length: repeat } as _, i (i)}\n\t\t<div\n\t\t\tclass={cn(\"flex shrink-0 justify-around gap-(--gap)\", {\n\t\t\t\t\"animate-marquee flex-row\": !vertical,\n\t\t\t\t\"animate-marquee-vertical flex-col\": vertical,\n\t\t\t\t\"group-hover:paused\": pauseOnHover,\n\t\t\t})}\n\t\t\tstyle=\"animation-direction:{reverse ? 'reverse' : 'normal'};\n      \"\n\t\t>\n\t\t\t{@render children?.()}\n\t\t</div>\n\t{/each}\n</div>\n\n<style>\n\t@keyframes marquee {\n\t\t0% {\n\t\t\ttransform: translateX(0%);\n\t\t}\n\t\t100% {\n\t\t\ttransform: translateX(-100%);\n\t\t}\n\t}\n\n\t@keyframes marquee-vertical {\n\t\t0% {\n\t\t\ttransform: translateY(0%);\n\t\t}\n\t\t100% {\n\t\t\ttransform: translateY(-100%);\n\t\t}\n\t}\n\n\t.animate-marquee {\n\t\tanimation: marquee var(--duration) linear infinite;\n\t}\n\n\t.animate-marquee-vertical {\n\t\tanimation: marquee-vertical var(--duration) linear infinite;\n\t}\n</style>\n",
			"type": "registry:component",
			"target": "magic/marquee/marquee.svelte"
		},
		{
			"content": "import Marquee from \"./marquee.svelte\";\nexport { Marquee };\n",
			"type": "registry:file",
			"target": "magic/marquee/index.ts"
		}
	]
}