fix: docs preview import paths (#810)

huntabyte · Feb 24, 2024 · 4d9a200 · 4d9a200
1 parent 922ebb3
commit 4d9a200
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 11 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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",