From 4d9a200465989aab4b0ae07e48ced4c52faab9a1 Mon Sep 17 00:00:00 2001
From: Hunter Johnston <64506580+huntabyte@users.noreply.github.com>
Date: Fri, 23 Feb 2024 22:48:06 -0500
Subject: [PATCH] fix: docs preview import paths (#810)

---
 apps/www/mdsx.config.js                                | 10 ++++++++--
 apps/www/static/registry/index.json                    |  4 +++-
 .../static/registry/styles/default-js/resizable.json   |  6 ++++--
 apps/www/static/registry/styles/default/resizable.json |  6 ++++--
 .../static/registry/styles/new-york-js/resizable.json  |  6 ++++--
 .../www/static/registry/styles/new-york/resizable.json |  6 ++++--
 6 files changed, 27 insertions(+), 11 deletions(-)

diff --git a/apps/www/mdsx.config.js b/apps/www/mdsx.config.js
index d351dd610..aec8ac31f 100644
--- a/apps/www/mdsx.config.js
+++ b/apps/www/mdsx.config.js
@@ -166,10 +166,16 @@ export function rehypeComponentExample() {
 						const component = Index[style.name][name];
 						const src = component.files[0];
 						let sourceCode = getComponentSourceFileContent(src);
-						if (!sourceCode) return;
+						if (!sourceCode || sourceCode === null) return;
+
+						// @ts-expect-error - not dealing with this rn
+						sourceCode = sourceCode.replaceAll(
+							"@/registry/new-york/",
+							"$lib/components/"
+						);
 						// @ts-expect-error - not dealing with this rn
 						sourceCode = sourceCode.replaceAll(
-							`@/registry/${style.name}/`,
+							"@/registry/default/",
 							"$lib/components/"
 						);
 
diff --git a/apps/www/static/registry/index.json b/apps/www/static/registry/index.json
index 6e0463fa8..5b84133d5 100644
--- a/apps/www/static/registry/index.json
+++ b/apps/www/static/registry/index.json
@@ -447,7 +447,9 @@
 	},
 	{
 		"name": "resizable",
-		"dependencies": [],
+		"dependencies": [
+			"paneforge"
+		],
 		"registryDependencies": [],
 		"files": [
 			"ui/resizable/index.ts",
diff --git a/apps/www/static/registry/styles/default-js/resizable.json b/apps/www/static/registry/styles/default-js/resizable.json
index f46aa4774..d928bea83 100644
--- a/apps/www/static/registry/styles/default-js/resizable.json
+++ b/apps/www/static/registry/styles/default-js/resizable.json
@@ -1,6 +1,8 @@
 {
 	"name": "resizable",
-	"dependencies": [],
+	"dependencies": [
+		"paneforge"
+	],
 	"registryDependencies": [],
 	"files": [
 		{
@@ -9,7 +11,7 @@
 		},
 		{
 			"name": "resizable-handle.svelte",
-			"content": "<script>\n\timport GripVertical from \"lucide-svelte/icons/grip-vertical\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\texport let withHandle = false;\n\texport let el = undefined;\n\tlet className = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"bg-border z-10 flex h-4 w-3 items-center justify-center rounded-sm border\">\n\t\t\t<GripVertical class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
+			"content": "<script>\n\timport GripVertical from \"lucide-svelte/icons/grip-vertical\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\texport let withHandle = false;\n\texport let el = undefined;\n\tlet className = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border\">\n\t\t\t<GripVertical class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
 		},
 		{
 			"name": "resizable-pane-group.svelte",
diff --git a/apps/www/static/registry/styles/default/resizable.json b/apps/www/static/registry/styles/default/resizable.json
index 65e8cf0ce..81e70f1fc 100644
--- a/apps/www/static/registry/styles/default/resizable.json
+++ b/apps/www/static/registry/styles/default/resizable.json
@@ -1,6 +1,8 @@
 {
 	"name": "resizable",
-	"dependencies": [],
+	"dependencies": [
+		"paneforge"
+	],
 	"registryDependencies": [],
 	"files": [
 		{
@@ -9,7 +11,7 @@
 		},
 		{
 			"name": "resizable-handle.svelte",
-			"content": "<script lang=\"ts\">\n\timport GripVertical from \"lucide-svelte/icons/grip-vertical\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\n\ttype $$Props = ResizablePrimitive.PaneResizerProps & {\n\t\twithHandle?: boolean;\n\t};\n\n\texport let withHandle: $$Props[\"withHandle\"] = false;\n\texport let el: $$Props[\"el\"] = undefined;\n\tlet className: $$Props[\"class\"] = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"bg-border z-10 flex h-4 w-3 items-center justify-center rounded-sm border\">\n\t\t\t<GripVertical class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
+			"content": "<script lang=\"ts\">\n\timport GripVertical from \"lucide-svelte/icons/grip-vertical\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\n\ttype $$Props = ResizablePrimitive.PaneResizerProps & {\n\t\twithHandle?: boolean;\n\t};\n\n\texport let withHandle: $$Props[\"withHandle\"] = false;\n\texport let el: $$Props[\"el\"] = undefined;\n\tlet className: $$Props[\"class\"] = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border\">\n\t\t\t<GripVertical class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
 		},
 		{
 			"name": "resizable-pane-group.svelte",
diff --git a/apps/www/static/registry/styles/new-york-js/resizable.json b/apps/www/static/registry/styles/new-york-js/resizable.json
index bfc710310..3776b4e58 100644
--- a/apps/www/static/registry/styles/new-york-js/resizable.json
+++ b/apps/www/static/registry/styles/new-york-js/resizable.json
@@ -1,6 +1,8 @@
 {
 	"name": "resizable",
-	"dependencies": [],
+	"dependencies": [
+		"paneforge"
+	],
 	"registryDependencies": [],
 	"files": [
 		{
@@ -9,7 +11,7 @@
 		},
 		{
 			"name": "resizable-handle.svelte",
-			"content": "<script>\n\timport DragHandleDots2 from \"svelte-radix/DragHandleDots2.svelte\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\texport let withHandle = false;\n\texport let el = undefined;\n\tlet className = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"bg-border z-10 flex h-4 w-3 items-center justify-center rounded-sm border\">\n\t\t\t<DragHandleDots2 class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
+			"content": "<script>\n\timport DragHandleDots2 from \"svelte-radix/DragHandleDots2.svelte\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\texport let withHandle = false;\n\texport let el = undefined;\n\tlet className = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border\">\n\t\t\t<DragHandleDots2 class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
 		},
 		{
 			"name": "resizable-pane-group.svelte",
diff --git a/apps/www/static/registry/styles/new-york/resizable.json b/apps/www/static/registry/styles/new-york/resizable.json
index 97ed2ffc3..31cbef11d 100644
--- a/apps/www/static/registry/styles/new-york/resizable.json
+++ b/apps/www/static/registry/styles/new-york/resizable.json
@@ -1,6 +1,8 @@
 {
 	"name": "resizable",
-	"dependencies": [],
+	"dependencies": [
+		"paneforge"
+	],
 	"registryDependencies": [],
 	"files": [
 		{
@@ -9,7 +11,7 @@
 		},
 		{
 			"name": "resizable-handle.svelte",
-			"content": "<script lang=\"ts\">\n\timport DragHandleDots2 from \"svelte-radix/DragHandleDots2.svelte\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\n\ttype $$Props = ResizablePrimitive.PaneResizerProps & {\n\t\twithHandle?: boolean;\n\t};\n\n\texport let withHandle: $$Props[\"withHandle\"] = false;\n\texport let el: $$Props[\"el\"] = undefined;\n\tlet className: $$Props[\"class\"] = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"bg-border z-10 flex h-4 w-3 items-center justify-center rounded-sm border\">\n\t\t\t<DragHandleDots2 class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
+			"content": "<script lang=\"ts\">\n\timport DragHandleDots2 from \"svelte-radix/DragHandleDots2.svelte\";\n\timport * as ResizablePrimitive from \"paneforge\";\n\timport { cn } from \"$lib/utils\";\n\n\ttype $$Props = ResizablePrimitive.PaneResizerProps & {\n\t\twithHandle?: boolean;\n\t};\n\n\texport let withHandle: $$Props[\"withHandle\"] = false;\n\texport let el: $$Props[\"el\"] = undefined;\n\tlet className: $$Props[\"class\"] = undefined;\n\texport { className as class };\n</script>\n\n<ResizablePrimitive.PaneResizer\n\tbind:el\n\tclass={cn(\n\t\t\"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[direction=vertical]:h-px data-[direction=vertical]:w-full data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:h-1 data-[direction=vertical]:after:w-full data-[direction=vertical]:after:-translate-y-1/2 data-[direction=vertical]:after:translate-x-0 [&[data-direction=vertical]>div]:rotate-90\",\n\t\tclassName\n\t)}\n>\n\t{#if withHandle}\n\t\t<div class=\"z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border\">\n\t\t\t<DragHandleDots2 class=\"h-2.5 w-2.5\" />\n\t\t</div>\n\t{/if}\n</ResizablePrimitive.PaneResizer>\n"
 		},
 		{
 			"name": "resizable-pane-group.svelte",