{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "striped-pattern",
	"title": "Striped Pattern",
	"type": "registry:block",
	"description": "An SVG-based striped pattern background component with configurable direction and stripe dimensions.",
	"files": [
		{
			"content": "<script lang=\"ts\">\n\timport { cn } from \"$UTILS$.js\";\n\timport type { SVGAttributes } from \"svelte/elements\";\n\n\tinterface Props extends SVGAttributes<SVGSVGElement> {\n\t\tdirection?: \"left\" | \"right\";\n\t\tclass?: string;\n\t}\n\n\tlet {\n\t\tdirection = \"left\",\n\t\tclass: className,\n\t\twidth = 10,\n\t\theight = 10,\n\t\t...restProps\n\t}: Props = $props();\n\n\tlet id = $props.id();\n\tlet w = $derived(Number(width));\n\tlet h = $derived(Number(height));\n</script>\n\n<svg\n\taria-hidden=\"true\"\n\tclass={cn(\"pointer-events-none absolute inset-0 z-10 h-full w-full stroke-[0.5]\", className)}\n\txmlns=\"http://www.w3.org/2000/svg\"\n\t{...restProps}\n>\n\t<defs>\n\t\t<pattern {id} width={w} height={h} patternUnits=\"userSpaceOnUse\">\n\t\t\t{#if direction === \"left\"}\n\t\t\t\t<line x1=\"0\" y1={h} x2={w} y2=\"0\" stroke=\"currentColor\" />\n\t\t\t\t<line x1={-w} y1={h} x2=\"0\" y2=\"0\" stroke=\"currentColor\" />\n\t\t\t\t<line x1={w} y1={h} x2={w * 2} y2=\"0\" stroke=\"currentColor\" />\n\t\t\t{:else}\n\t\t\t\t<line x1=\"0\" y1=\"0\" x2={w} y2={h} stroke=\"currentColor\" />\n\t\t\t\t<line x1={-w} y1=\"0\" x2=\"0\" y2={h} stroke=\"currentColor\" />\n\t\t\t\t<line x1={w} y1=\"0\" x2={w * 2} y2={h} stroke=\"currentColor\" />\n\t\t\t{/if}\n\t\t</pattern>\n\t</defs>\n\t<rect width=\"100%\" height=\"100%\" fill={`url(#${id})`} />\n</svg>\n",
			"type": "registry:component",
			"target": "magic/striped-pattern/striped-pattern.svelte"
		},
		{
			"content": "import StripedPattern from \"./striped-pattern.svelte\";\nexport { StripedPattern };\n",
			"type": "registry:file",
			"target": "magic/striped-pattern/index.ts"
		}
	]
}