storybook-addon-dependency-previews 0.1.0

package/dist/hooks/useDynamicStory.mjs

@@ -0,0 +1,82 @@
+import { useStoryParams } from "./useStoryParams.mjs";
+import { useEffect, useMemo, useState } from "react";
+
+//#region src/hooks/useDynamicStory.ts
+function findStoryImporter(storiesGlob, storyFilePath) {
+	if (!storyFilePath) {
+		return null;
+	}
+	const norm = (p) => "/" + p.replace(/^[./]+/, "").replace(/\\/g, "/");
+	const wanted = norm(storyFilePath);
+	return storiesGlob[wanted] || Object.entries(storiesGlob).find(([k]) => k.endsWith(wanted))?.[1];
+}
+function useDynamicStory(storyInfo) {
+	const { dependencyPreviews } = useStoryParams();
+	const modules = dependencyPreviews.storyModules;
+	const importer = useMemo(() => findStoryImporter(modules, storyInfo.storyFilePath), [modules, storyInfo.storyFilePath]);
+	const [csfModule, setCsfModule] = useState(null);
+	const [err, setErr] = useState(null);
+	const [isLoading, setIsLoading] = useState(true);
+	useEffect(() => {
+		let alive = true;
+		setIsLoading(true);
+		(async () => {
+			try {
+				if (!importer) throw new Error(`No story module found at this path: ${storyInfo.storyFilePath}`);
+				const mod = await importer();
+				if (alive) setCsfModule(mod);
+			} catch (e) {
+				if (alive) setErr(e?.message || String(e));
+			} finally {
+				setIsLoading(false);
+			}
+		})();
+		return () => {
+			alive = false;
+		};
+	}, [importer, storyInfo.componentPath]);
+	const primaryExport = getPrimaryStoryExport(csfModule, storyInfo);
+	const Component = csfModule?.default?.component;
+	const primaryId = storyInfo.storyId?.replace(/--docs$/, getPrimaryId(csfModule));
+	return {
+		isLoading,
+		primaryExport,
+		primaryId,
+		csfModule,
+		Component,
+		error: err
+	};
+}
+function getPrimaryId(csfModule) {
+	if (!csfModule) return "--default";
+	if ("Default" in csfModule) return "--default";
+	if ("Primary" in csfModule) return "--primary";
+	return "--" + slugifyExportName(csfModule?.__namedExportsOrder?.[0] || "default");
+}
+function slugifyExportName(name) {
+	return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").replace(/[_\s]+/g, "-").replace(/[^a-zA-Z0-9-]/g, "-").toLowerCase().replace(/--+/g, "-").replace(/^-+|-+$/g, "");
+}
+/** Choose a sensible story:
+*  1) If the module has `Primary`, use it.
+*  2) If we have a docs/primary id, try to match the export name in the id.
+*  3) Else fall back to the first named export.
+*/
+function getPrimaryStoryExport(mod, info) {
+	if (!mod) return null;
+	if ("Default" in mod) return mod.Default;
+	if ("Primary" in mod) return mod.Primary;
+	if (info?.storyId && !info.storyId.endsWith("--docs")) {
+		const exportName = info.storyId.split("--").pop();
+		const match = Object.keys(mod).find((k) => k !== "default" && k.toLowerCase() === exportName);
+		if (match) return mod[match];
+	}
+	const order = mod.__namedExportsOrder || [];
+	const first = order.find((k) => k !== "default");
+	if (first && first in mod) return mod[first];
+	const anyKey = Object.keys(mod).find((k) => k !== "default" && typeof mod[k] === "function");
+	return anyKey ? mod[anyKey] : null;
+}
+
+//#endregion
+export { useDynamicStory };
+//# sourceMappingURL=useDynamicStory.mjs.map

package/dist/hooks/useDynamicStory.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDynamicStory.mjs","names":[],"sources":["../../src/hooks/useDynamicStory.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react'\nimport type { CsfModule, StoryInfo, StoryModules } from '../types'\nimport { useStoryParams } from './useStoryParams'\n\n// grab all stories; Vite will code-split them\n\nfunction findStoryImporter(\n\tstoriesGlob: StoryModules,\n\tstoryFilePath: string | undefined | null,\n) {\n\tif (!storyFilePath) {\n\t\treturn null\n\t}\n\t// normalize to Vite’s absolute-style keys\n\tconst norm = (p: string) =>\n\t\t'/' + p.replace(/^[./]+/, '').replace(/\\\\/g, '/')\n\tconst wanted = norm(storyFilePath)\n\t// exact match first, else suffix match as a fallback\n\treturn (\n\t\tstoriesGlob[wanted] ||\n\t\tObject.entries(storiesGlob).find(([k]) => k.endsWith(wanted))?.[1]\n\t)\n}\n\nexport function useDynamicStory(storyInfo: StoryInfo) {\n\tconst { dependencyPreviews } = useStoryParams()\n\tconst modules = dependencyPreviews.storyModules\n\tconst importer = useMemo(\n\t\t() => findStoryImporter(modules, storyInfo.storyFilePath),\n\t\t[modules, storyInfo.storyFilePath],\n\t)\n\tconst [csfModule, setCsfModule] = useState<CsfModule | null>(null)\n\tconst [err, setErr] = useState<string | null>(null)\n\tconst [isLoading, setIsLoading] = useState(true)\n\n\tuseEffect(() => {\n\t\tlet alive = true\n\t\tsetIsLoading(true)\n\t\t;(async () => {\n\t\t\ttry {\n\t\t\t\tif (!importer)\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t`No story module found at this path: ${storyInfo.storyFilePath}`,\n\t\t\t\t\t)\n\t\t\t\tconst mod = await importer()\n\t\t\t\tif (alive) setCsfModule(mod as CsfModule)\n\t\t\t} catch (e: any) {\n\t\t\t\tif (alive) setErr(e?.message || String(e))\n\t\t\t} finally {\n\t\t\t\tsetIsLoading(false)\n\t\t\t}\n\t\t})()\n\t\treturn () => {\n\t\t\talive = false\n\t\t}\n\t}, [importer, storyInfo.componentPath])\n\n\tconst primaryExport = getPrimaryStoryExport(csfModule, storyInfo)\n\tconst Component = csfModule?.default?.component\n\tconst primaryId = storyInfo.storyId?.replace(\n\t\t/--docs$/,\n\t\tgetPrimaryId(csfModule),\n\t)\n\n\treturn {\n\t\tisLoading,\n\t\tprimaryExport,\n\t\tprimaryId,\n\t\tcsfModule,\n\t\tComponent,\n\t\terror: err,\n\t}\n}\n\nfunction getPrimaryId(csfModule: CsfModule | undefined | null) {\n\tif (!csfModule) return '--default'\n\tif ('Default' in csfModule) return '--default'\n\tif ('Primary' in csfModule) return '--primary'\n\treturn (\n\t\t'--' +\n\t\tslugifyExportName(csfModule?.__namedExportsOrder?.[0] || 'default')\n\t)\n}\n\n// Kebab-case like Storybook: \"ErrorStrings\" -> \"error-strings\"\nfunction slugifyExportName(name: string) {\n\treturn (\n\t\tname\n\t\t\t// split camelCase / PascalCase boundaries\n\t\t\t.replace(/([a-z0-9])([A-Z])/g, '$1-$2')\n\t\t\t.replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2') // ABCDef -> ABC-Def\n\t\t\t// underscores/spaces -> dashes\n\t\t\t.replace(/[_\\s]+/g, '-')\n\t\t\t// strip anything not alnum or dash\n\t\t\t.replace(/[^a-zA-Z0-9-]/g, '-')\n\t\t\t// lowercase + collapse/trim dashes\n\t\t\t.toLowerCase()\n\t\t\t.replace(/--+/g, '-')\n\t\t\t.replace(/^-+|-+$/g, '')\n\t)\n}\n\n/** Choose a sensible story:\n *  1) If the module has `Primary`, use it.\n *  2) If we have a docs/primary id, try to match the export name in the id.\n *  3) Else fall back to the first named export.\n */\nfunction getPrimaryStoryExport(mod: any, info?: StoryInfo) {\n\tif (!mod) return null\n\n\t// 1) Prefer \"Default\" or \"Primary\" if present\n\tif ('Default' in mod) return mod.Default\n\tif ('Primary' in mod) return mod.Primary\n\n\t// 2) If we have a storyId like \"…--errorstrings\", try to match export name\n\tif (info?.storyId && !info.storyId.endsWith('--docs')) {\n\t\tconst exportName = info.storyId.split('--').pop() // e.g. \"errorstrings\"\n\t\tconst match = Object.keys(mod).find(\n\t\t\t(k) => k !== 'default' && k.toLowerCase() === exportName,\n\t\t)\n\t\tif (match) return (mod as any)[match]\n\t}\n\n\t// 3) Fall back to first named export\n\tconst order: string[] = mod.__namedExportsOrder || []\n\tconst first = order.find((k) => k !== 'default')\n\tif (first && first in mod) return (mod as any)[first]\n\n\t// Last resort: any non-default function export\n\tconst anyKey = Object.keys(mod).find(\n\t\t(k) => k !== 'default' && typeof mod[k] === 'function',\n\t)\n\treturn anyKey ? (mod as any)[anyKey] : null\n}\n"],"mappings":";;;;AAMA,SAAS,kBACR,aACA,eACC;AACD,KAAI,CAAC,eAAe;AACnB,SAAO;;CAGR,MAAM,QAAQ,MACb,MAAM,EAAE,QAAQ,UAAU,GAAG,CAAC,QAAQ,OAAO,IAAI;CAClD,MAAM,SAAS,KAAK,cAAc;AAElC,QACC,YAAY,WACZ,OAAO,QAAQ,YAAY,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,OAAO,CAAC,GAAG;;AAIlE,SAAgB,gBAAgB,WAAsB;CACrD,MAAM,EAAE,uBAAuB,gBAAgB;CAC/C,MAAM,UAAU,mBAAmB;CACnC,MAAM,WAAW,cACV,kBAAkB,SAAS,UAAU,cAAc,EACzD,CAAC,SAAS,UAAU,cAAc,CAClC;CACD,MAAM,CAAC,WAAW,gBAAgB,SAA2B,KAAK;CAClE,MAAM,CAAC,KAAK,UAAU,SAAwB,KAAK;CACnD,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;AAEhD,iBAAgB;EACf,IAAI,QAAQ;AACZ,eAAa,KAAK;AACjB,GAAC,YAAY;AACb,OAAI;AACH,QAAI,CAAC,SACJ,OAAM,IAAI,MACT,uCAAuC,UAAU,gBACjD;IACF,MAAM,MAAM,MAAM,UAAU;AAC5B,QAAI,MAAO,cAAa,IAAiB;YACjC,GAAQ;AAChB,QAAI,MAAO,QAAO,GAAG,WAAW,OAAO,EAAE,CAAC;aACjC;AACT,iBAAa,MAAM;;MAEjB;AACJ,eAAa;AACZ,WAAQ;;IAEP,CAAC,UAAU,UAAU,cAAc,CAAC;CAEvC,MAAM,gBAAgB,sBAAsB,WAAW,UAAU;CACjE,MAAM,YAAY,WAAW,SAAS;CACtC,MAAM,YAAY,UAAU,SAAS,QACpC,WACA,aAAa,UAAU,CACvB;AAED,QAAO;EACN;EACA;EACA;EACA;EACA;EACA,OAAO;EACP;;AAGF,SAAS,aAAa,WAAyC;AAC9D,KAAI,CAAC,UAAW,QAAO;AACvB,KAAI,aAAa,UAAW,QAAO;AACnC,KAAI,aAAa,UAAW,QAAO;AACnC,QACC,OACA,kBAAkB,WAAW,sBAAsB,MAAM,UAAU;;AAKrE,SAAS,kBAAkB,MAAc;AACxC,QACC,KAEE,QAAQ,sBAAsB,QAAQ,CACtC,QAAQ,yBAAyB,QAAQ,CAEzC,QAAQ,WAAW,IAAI,CAEvB,QAAQ,kBAAkB,IAAI,CAE9B,aAAa,CACb,QAAQ,QAAQ,IAAI,CACpB,QAAQ,YAAY,GAAG;;;;;;;AAS3B,SAAS,sBAAsB,KAAU,MAAkB;AAC1D,KAAI,CAAC,IAAK,QAAO;AAGjB,KAAI,aAAa,IAAK,QAAO,IAAI;AACjC,KAAI,aAAa,IAAK,QAAO,IAAI;AAGjC,KAAI,MAAM,WAAW,CAAC,KAAK,QAAQ,SAAS,SAAS,EAAE;EACtD,MAAM,aAAa,KAAK,QAAQ,MAAM,KAAK,CAAC,KAAK;EACjD,MAAM,QAAQ,OAAO,KAAK,IAAI,CAAC,MAC7B,MAAM,MAAM,aAAa,EAAE,aAAa,KAAK,WAC9C;AACD,MAAI,MAAO,QAAQ,IAAY;;CAIhC,MAAM,QAAkB,IAAI,uBAAuB,EAAE;CACrD,MAAM,QAAQ,MAAM,MAAM,MAAM,MAAM,UAAU;AAChD,KAAI,SAAS,SAAS,IAAK,QAAQ,IAAY;CAG/C,MAAM,SAAS,OAAO,KAAK,IAAI,CAAC,MAC9B,MAAM,MAAM,aAAa,OAAO,IAAI,OAAO,WAC5C;AACD,QAAO,SAAU,IAAY,UAAU"}

package/dist/hooks/useStoryParams.cjs

@@ -0,0 +1,17 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+let _storybook_addon_docs_blocks = require("@storybook/addon-docs/blocks");
+
+//#region src/hooks/useStoryParams.ts
+function useStoryParams() {
+	const resolved = (0, _storybook_addon_docs_blocks.useOf)("story");
+	const story = resolved?.story;
+	const storyId = story?.id;
+	return {
+		...story?.parameters,
+		_storyId: storyId
+	};
+}
+
+//#endregion
+exports.useStoryParams = useStoryParams;
+//# sourceMappingURL=useStoryParams.cjs.map

package/dist/hooks/useStoryParams.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStoryParams.cjs","names":[],"sources":["../../src/hooks/useStoryParams.ts"],"sourcesContent":["import { useOf } from '@storybook/addon-docs/blocks'\nimport type { DependencyPreviewStorybookParameters } from '../types'\n\nexport function useStoryParams(): DependencyPreviewStorybookParameters & {\n\t_storyId?: string\n} {\n\tconst resolved = useOf<'story'>('story')\n\tconst story = resolved?.story\n\t// Get the story ID - this is the most reliable identifier available at runtime\n\t// It matches the storyId field in the dependency graph JSON\n\tconst storyId = story?.id\n\n\treturn {\n\t\t...(story?.parameters as DependencyPreviewStorybookParameters),\n\t\t_storyId: storyId,\n\t}\n}\n"],"mappings":";;;;AAGA,SAAgB,iBAEd;CACD,MAAM,mDAA0B,QAAQ;CACxC,MAAM,QAAQ,UAAU;CAGxB,MAAM,UAAU,OAAO;AAEvB,QAAO;EACN,GAAI,OAAO;EACX,UAAU;EACV"}

package/dist/hooks/useStoryParams.mjs

@@ -0,0 +1,16 @@
+import { useOf } from "@storybook/addon-docs/blocks";
+
+//#region src/hooks/useStoryParams.ts
+function useStoryParams() {
+	const resolved = useOf("story");
+	const story = resolved?.story;
+	const storyId = story?.id;
+	return {
+		...story?.parameters,
+		_storyId: storyId
+	};
+}
+
+//#endregion
+export { useStoryParams };
+//# sourceMappingURL=useStoryParams.mjs.map

package/dist/hooks/useStoryParams.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStoryParams.mjs","names":[],"sources":["../../src/hooks/useStoryParams.ts"],"sourcesContent":["import { useOf } from '@storybook/addon-docs/blocks'\nimport type { DependencyPreviewStorybookParameters } from '../types'\n\nexport function useStoryParams(): DependencyPreviewStorybookParameters & {\n\t_storyId?: string\n} {\n\tconst resolved = useOf<'story'>('story')\n\tconst story = resolved?.story\n\t// Get the story ID - this is the most reliable identifier available at runtime\n\t// It matches the storyId field in the dependency graph JSON\n\tconst storyId = story?.id\n\n\treturn {\n\t\t...(story?.parameters as DependencyPreviewStorybookParameters),\n\t\t_storyId: storyId,\n\t}\n}\n"],"mappings":";;;AAGA,SAAgB,iBAEd;CACD,MAAM,WAAW,MAAe,QAAQ;CACxC,MAAM,QAAQ,UAAU;CAGxB,MAAM,UAAU,OAAO;AAEvB,QAAO;EACN,GAAI,OAAO;EACX,UAAU;EACV"}

package/dist/index.cjs

@@ -0,0 +1,15 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_DependencyPreviews = require('./blocks/DependencyPreviews.cjs');
+require('./blocks/index.cjs');
+const require_DefaultAutoDocsLayout = require('./panels/DefaultAutoDocsLayout.cjs');
+const require_GraphView = require('./panels/GraphView.cjs');
+require('./panels/index.cjs');
+require('./types.cjs');
+const require_preview = require('./preview.cjs');
+
+exports.DefaultAutoDocsLayout = require_DefaultAutoDocsLayout.DefaultAutoDocsLayout;
+exports.DependencyPreviews = require_DependencyPreviews.DependencyPreviews;
+exports.GraphView = require_GraphView.GraphView;
+exports.decorators = require_preview.decorators;
+exports.defaultPreviewParameters = require_DefaultAutoDocsLayout.defaultPreviewParameters;
+exports.dependencyPreviewDecorators = require_preview.dependencyPreviewDecorators;

package/dist/index.d.cts

@@ -0,0 +1,6 @@
+import { DependencyPreviews } from "./blocks/DependencyPreviews.cjs";
+import { AnyObj, CsfModule, DecoratorFn, DependencyPreviewStorybookParameters, Deps, Graph, StoryExport, StoryInfo, StoryModules, StoryParameters, StorybookParameters, StorybookPreviewConfig } from "./types.cjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./panels/DefaultAutoDocsLayout.cjs";
+import { GraphView } from "./panels/GraphView.cjs";
+import { decorators, dependencyPreviewDecorators } from "./preview.cjs";
+export { AnyObj, CsfModule, DecoratorFn, DefaultAutoDocsLayout, DependencyPreviewStorybookParameters, DependencyPreviews, Deps, Graph, GraphView, StoryExport, StoryInfo, StoryModules, StoryParameters, StorybookParameters, StorybookPreviewConfig, decorators, defaultPreviewParameters, dependencyPreviewDecorators };

package/dist/index.d.mts

@@ -0,0 +1,6 @@
+import { DependencyPreviews } from "./blocks/DependencyPreviews.mjs";
+import { AnyObj, CsfModule, DecoratorFn, DependencyPreviewStorybookParameters, Deps, Graph, StoryExport, StoryInfo, StoryModules, StoryParameters, StorybookParameters, StorybookPreviewConfig } from "./types.mjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./panels/DefaultAutoDocsLayout.mjs";
+import { GraphView } from "./panels/GraphView.mjs";
+import { decorators, dependencyPreviewDecorators } from "./preview.mjs";
+export { AnyObj, CsfModule, DecoratorFn, DefaultAutoDocsLayout, DependencyPreviewStorybookParameters, DependencyPreviews, Deps, Graph, GraphView, StoryExport, StoryInfo, StoryModules, StoryParameters, StorybookParameters, StorybookPreviewConfig, decorators, defaultPreviewParameters, dependencyPreviewDecorators };

package/dist/index.mjs

@@ -0,0 +1,9 @@
+import { DependencyPreviews } from "./blocks/DependencyPreviews.mjs";
+import "./blocks/index.mjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./panels/DefaultAutoDocsLayout.mjs";
+import { GraphView } from "./panels/GraphView.mjs";
+import "./panels/index.mjs";
+import "./types.mjs";
+import { decorators, dependencyPreviewDecorators } from "./preview.mjs";
+
+export { DefaultAutoDocsLayout, DependencyPreviews, GraphView, decorators, defaultPreviewParameters, dependencyPreviewDecorators };

package/dist/manager.cjs

@@ -0,0 +1,22 @@
+const require_runtime = require('./_virtual/_rolldown/runtime.cjs');
+const require_GraphView = require('./panels/GraphView.cjs');
+const require_constants = require('./constants.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+let storybook_manager_api = require("storybook/manager-api");
+let storybook_internal_components = require("storybook/internal/components");
+
+//#region src/manager.tsx
+storybook_manager_api.addons.register(require_constants.ADDON_ID, () => {
+	storybook_manager_api.addons.add(require_constants.PANEL_ID, {
+		title: "Dependency Previews",
+		type: storybook_manager_api.types.PANEL,
+		match: ({ viewMode }) => viewMode === "story" || viewMode === "docs",
+		render: ({ active }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(storybook_internal_components.AddonPanel, {
+			active,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_GraphView.GraphView, {})
+		})
+	});
+});
+
+//#endregion
+//# sourceMappingURL=manager.cjs.map

package/dist/manager.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"manager.cjs","names":["addons","ADDON_ID","PANEL_ID","types","AddonPanel","GraphView"],"sources":["../src/manager.tsx"],"sourcesContent":["import { addons, types } from 'storybook/manager-api'\nimport { AddonPanel } from 'storybook/internal/components'\nimport { ADDON_ID, PANEL_ID } from './constants'\nimport { GraphView } from './panels/GraphView'\n\naddons.register(ADDON_ID, () => {\n\taddons.add(PANEL_ID, {\n\t\ttitle: 'Dependency Previews',\n\t\ttype: types.PANEL,\n\t\tmatch: ({ viewMode }) => viewMode === 'story' || viewMode === 'docs',\n\t\trender: ({ active }) => (\n\t\t\t<AddonPanel active={active!}>\n\t\t\t\t<GraphView />\n\t\t\t</AddonPanel>\n\t\t),\n\t})\n})\n"],"mappings":";;;;;;;;AAKAA,6BAAO,SAASC,kCAAgB;AAC/B,8BAAO,IAAIC,4BAAU;EACpB,OAAO;EACP,MAAMC,4BAAM;EACZ,QAAQ,EAAE,eAAe,aAAa,WAAW,aAAa;EAC9D,SAAS,EAAE,aACV,2CAACC;GAAmB;aACnB,2CAACC,gCAAY;IACD;EAEd,CAAC;EACD"}

package/dist/manager.d.cts

@@ -0,0 +1 @@
+export { };

package/dist/manager.d.mts

@@ -0,0 +1 @@
+export { };

package/dist/manager.mjs

@@ -0,0 +1,21 @@
+import { GraphView } from "./panels/GraphView.mjs";
+import { ADDON_ID, PANEL_ID } from "./constants.mjs";
+import { jsx } from "react/jsx-runtime";
+import { addons, types } from "storybook/manager-api";
+import { AddonPanel } from "storybook/internal/components";
+
+//#region src/manager.tsx
+addons.register(ADDON_ID, () => {
+	addons.add(PANEL_ID, {
+		title: "Dependency Previews",
+		type: types.PANEL,
+		match: ({ viewMode }) => viewMode === "story" || viewMode === "docs",
+		render: ({ active }) => /* @__PURE__ */ jsx(AddonPanel, {
+			active,
+			children: /* @__PURE__ */ jsx(GraphView, {})
+		})
+	});
+});
+
+//#endregion
+//# sourceMappingURL=manager.mjs.map

package/dist/manager.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"manager.mjs","names":[],"sources":["../src/manager.tsx"],"sourcesContent":["import { addons, types } from 'storybook/manager-api'\nimport { AddonPanel } from 'storybook/internal/components'\nimport { ADDON_ID, PANEL_ID } from './constants'\nimport { GraphView } from './panels/GraphView'\n\naddons.register(ADDON_ID, () => {\n\taddons.add(PANEL_ID, {\n\t\ttitle: 'Dependency Previews',\n\t\ttype: types.PANEL,\n\t\tmatch: ({ viewMode }) => viewMode === 'story' || viewMode === 'docs',\n\t\trender: ({ active }) => (\n\t\t\t<AddonPanel active={active!}>\n\t\t\t\t<GraphView />\n\t\t\t</AddonPanel>\n\t\t),\n\t})\n})\n"],"mappings":";;;;;;;AAKA,OAAO,SAAS,gBAAgB;AAC/B,QAAO,IAAI,UAAU;EACpB,OAAO;EACP,MAAM,MAAM;EACZ,QAAQ,EAAE,eAAe,aAAa,WAAW,aAAa;EAC9D,SAAS,EAAE,aACV,oBAAC;GAAmB;aACnB,oBAAC,cAAY;IACD;EAEd,CAAC;EACD"}

package/dist/panels/DefaultAutoDocsLayout.cjs

@@ -0,0 +1,24 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+const require_DependencyPreviews = require('../blocks/DependencyPreviews.cjs');
+require('../blocks/index.cjs');
+let _storybook_addon_docs_blocks = require("@storybook/addon-docs/blocks");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/panels/DefaultAutoDocsLayout.tsx
+function DefaultAutoDocsLayout() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Title, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Subtitle, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Description, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Primary, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Controls, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_DependencyPreviews.DependencyPreviews, {}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_storybook_addon_docs_blocks.Stories, {})
+	] });
+}
+const defaultPreviewParameters = { docs: { page: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DefaultAutoDocsLayout, {}) } };
+
+//#endregion
+exports.DefaultAutoDocsLayout = DefaultAutoDocsLayout;
+exports.defaultPreviewParameters = defaultPreviewParameters;
+//# sourceMappingURL=DefaultAutoDocsLayout.cjs.map

package/dist/panels/DefaultAutoDocsLayout.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultAutoDocsLayout.cjs","names":["Title","Subtitle","Description","Primary","Controls","DependencyPreviews","Stories"],"sources":["../../src/panels/DefaultAutoDocsLayout.tsx"],"sourcesContent":["import {\n\tControls,\n\tDescription,\n\tPrimary,\n\tStories,\n\tSubtitle,\n\tTitle,\n} from '@storybook/addon-docs/blocks'\nimport { DependencyPreviews } from '../blocks'\nimport type { StorybookParameters } from '../types'\n\nexport { DependencyPreviews }\n\nexport function DefaultAutoDocsLayout() {\n\treturn (\n\t\t<>\n\t\t\t<Title />\n\t\t\t<Subtitle />\n\t\t\t<Description />\n\t\t\t<Primary />\n\t\t\t<Controls />\n\t\t\t<DependencyPreviews />\n\t\t\t<Stories />\n\t\t</>\n\t)\n}\n\nexport const defaultPreviewParameters: StorybookParameters = {\n\tdocs: {\n\t\tpage: () => <DefaultAutoDocsLayout />,\n\t},\n}\n"],"mappings":";;;;;;;AAaA,SAAgB,wBAAwB;AACvC,QACC;EACC,2CAACA,uCAAQ;EACT,2CAACC,0CAAW;EACZ,2CAACC,6CAAc;EACf,2CAACC,yCAAU;EACX,2CAACC,0CAAW;EACZ,2CAACC,kDAAqB;EACtB,2CAACC,yCAAU;KACT;;AAIL,MAAa,2BAAgD,EAC5D,MAAM,EACL,YAAY,2CAAC,0BAAwB,EACrC,EACD"}

package/dist/panels/DefaultAutoDocsLayout.d.cts

@@ -0,0 +1,10 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.cjs";
+import { StorybookParameters } from "../types.cjs";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
+
+//#region src/panels/DefaultAutoDocsLayout.d.ts
+declare function DefaultAutoDocsLayout(): react_jsx_runtime3.JSX.Element;
+declare const defaultPreviewParameters: StorybookParameters;
+//#endregion
+export { DefaultAutoDocsLayout, defaultPreviewParameters };
+//# sourceMappingURL=DefaultAutoDocsLayout.d.cts.map

package/dist/panels/DefaultAutoDocsLayout.d.mts

@@ -0,0 +1,10 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.mjs";
+import { StorybookParameters } from "../types.mjs";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
+
+//#region src/panels/DefaultAutoDocsLayout.d.ts
+declare function DefaultAutoDocsLayout(): react_jsx_runtime2.JSX.Element;
+declare const defaultPreviewParameters: StorybookParameters;
+//#endregion
+export { DefaultAutoDocsLayout, defaultPreviewParameters };
+//# sourceMappingURL=DefaultAutoDocsLayout.d.mts.map

package/dist/panels/DefaultAutoDocsLayout.mjs

@@ -0,0 +1,22 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.mjs";
+import "../blocks/index.mjs";
+import { Controls, Description, Primary, Stories, Subtitle, Title } from "@storybook/addon-docs/blocks";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/panels/DefaultAutoDocsLayout.tsx
+function DefaultAutoDocsLayout() {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(Title, {}),
+		/* @__PURE__ */ jsx(Subtitle, {}),
+		/* @__PURE__ */ jsx(Description, {}),
+		/* @__PURE__ */ jsx(Primary, {}),
+		/* @__PURE__ */ jsx(Controls, {}),
+		/* @__PURE__ */ jsx(DependencyPreviews, {}),
+		/* @__PURE__ */ jsx(Stories, {})
+	] });
+}
+const defaultPreviewParameters = { docs: { page: () => /* @__PURE__ */ jsx(DefaultAutoDocsLayout, {}) } };
+
+//#endregion
+export { DefaultAutoDocsLayout, defaultPreviewParameters };
+//# sourceMappingURL=DefaultAutoDocsLayout.mjs.map

package/dist/panels/DefaultAutoDocsLayout.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultAutoDocsLayout.mjs","names":[],"sources":["../../src/panels/DefaultAutoDocsLayout.tsx"],"sourcesContent":["import {\n\tControls,\n\tDescription,\n\tPrimary,\n\tStories,\n\tSubtitle,\n\tTitle,\n} from '@storybook/addon-docs/blocks'\nimport { DependencyPreviews } from '../blocks'\nimport type { StorybookParameters } from '../types'\n\nexport { DependencyPreviews }\n\nexport function DefaultAutoDocsLayout() {\n\treturn (\n\t\t<>\n\t\t\t<Title />\n\t\t\t<Subtitle />\n\t\t\t<Description />\n\t\t\t<Primary />\n\t\t\t<Controls />\n\t\t\t<DependencyPreviews />\n\t\t\t<Stories />\n\t\t</>\n\t)\n}\n\nexport const defaultPreviewParameters: StorybookParameters = {\n\tdocs: {\n\t\tpage: () => <DefaultAutoDocsLayout />,\n\t},\n}\n"],"mappings":";;;;;;AAaA,SAAgB,wBAAwB;AACvC,QACC;EACC,oBAAC,UAAQ;EACT,oBAAC,aAAW;EACZ,oBAAC,gBAAc;EACf,oBAAC,YAAU;EACX,oBAAC,aAAW;EACZ,oBAAC,uBAAqB;EACtB,oBAAC,YAAU;KACT;;AAIL,MAAa,2BAAgD,EAC5D,MAAM,EACL,YAAY,oBAAC,0BAAwB,EACrC,EACD"}

package/dist/panels/GraphView.cjs

@@ -0,0 +1,78 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/panels/GraphView.tsx
+const DEFAULT_URL = "/dependency-previews.json";
+function GraphView() {
+	const [graph, setGraph] = (0, react.useState)(null);
+	const [q, setQ] = (0, react.useState)("");
+	const [err, setErr] = (0, react.useState)(null);
+	(0, react.useEffect)(() => {
+		let alive = true;
+		(async () => {
+			try {
+				const res = await fetch(DEFAULT_URL);
+				if (!res.ok) throw new Error(`HTTP ${res.status}`);
+				const json = await res.json();
+				if (alive) setGraph(json);
+			} catch (e) {
+				if (alive) setErr(e?.message || String(e));
+			}
+		})();
+		return () => {
+			alive = false;
+		};
+	}, []);
+	if (err) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: ["Failed to load dependency previews: ", err] });
+	if (!graph) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "Loading dependency graph…" });
+	const entries = Object.entries(graph).filter(([k]) => k.toLowerCase().includes(q.toLowerCase())).sort(([a], [b]) => a.localeCompare(b));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		style: {
+			padding: 12,
+			display: "grid",
+			gap: 12
+		},
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				placeholder: "Filter by file path",
+				value: q,
+				onChange: (e) => setQ(e.target.value),
+				style: {
+					padding: 6,
+					font: "inherit"
+				}
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				style: {
+					fontSize: 12,
+					opacity: .7
+				},
+				children: [
+					entries.length,
+					" of ",
+					Object.keys(graph).length,
+					" components"
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				style: {
+					display: "grid",
+					gap: 10
+				},
+				children: entries.map(([file, node]) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("summary", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children: file }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					style: {
+						display: "grid",
+						gap: 6,
+						padding: "6px 0 0"
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: "Built with" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", { children: node.builtWith.map((f) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children: f.componentPath }) }, f.componentPath)) })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: "Used in" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", { children: node.usedIn.map((f) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children: f.componentPath }) }, f.componentPath)) })] })]
+				})] }, file))
+			})
+		]
+	});
+}
+
+//#endregion
+exports.GraphView = GraphView;
+//# sourceMappingURL=GraphView.cjs.map

package/dist/panels/GraphView.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraphView.cjs","names":[],"sources":["../../src/panels/GraphView.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport type { Graph } from '../types'\n\nconst DEFAULT_URL = '/dependency-previews.json'\n\nexport function GraphView() {\n\tconst [graph, setGraph] = useState<Graph | null>(null)\n\tconst [q, setQ] = useState('')\n\tconst [err, setErr] = useState<string | null>(null)\n\n\tuseEffect(() => {\n\t\tlet alive = true\n\t\t;(async () => {\n\t\t\ttry {\n\t\t\t\tconst res = await fetch(DEFAULT_URL)\n\t\t\t\tif (!res.ok) throw new Error(`HTTP ${res.status}`)\n\t\t\t\tconst json = (await res.json()) as Graph\n\t\t\t\tif (alive) setGraph(json)\n\t\t\t} catch (e: any) {\n\t\t\t\tif (alive) setErr(e?.message || String(e))\n\t\t\t}\n\t\t})()\n\t\treturn () => {\n\t\t\talive = false\n\t\t}\n\t}, [])\n\n\tif (err) return <p>Failed to load dependency previews: {err}</p>\n\tif (!graph) return <p>Loading dependency graph…</p>\n\n\tconst entries = Object.entries(graph)\n\t\t.filter(([k]) => k.toLowerCase().includes(q.toLowerCase()))\n\t\t.sort(([a], [b]) => a.localeCompare(b))\n\n\treturn (\n\t\t<div style={{ padding: 12, display: 'grid', gap: 12 }}>\n\t\t\t<input\n\t\t\t\tplaceholder=\"Filter by file path\"\n\t\t\t\tvalue={q}\n\t\t\t\tonChange={(e) => setQ(e.target.value)}\n\t\t\t\tstyle={{ padding: 6, font: 'inherit' }}\n\t\t\t/>\n\t\t\t<div style={{ fontSize: 12, opacity: 0.7 }}>\n\t\t\t\t{entries.length} of {Object.keys(graph).length} components\n\t\t\t</div>\n\t\t\t<div style={{ display: 'grid', gap: 10 }}>\n\t\t\t\t{entries.map(([file, node]) => (\n\t\t\t\t\t<details key={file}>\n\t\t\t\t\t\t<summary>\n\t\t\t\t\t\t\t<code>{file}</code>\n\t\t\t\t\t\t</summary>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'grid',\n\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\tpadding: '6px 0 0',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<strong>Built with</strong>\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{node.builtWith.map((f) => (\n\t\t\t\t\t\t\t\t\t\t<li key={f.componentPath}>\n\t\t\t\t\t\t\t\t\t\t\t<code>{f.componentPath}</code>\n\t\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<strong>Used in</strong>\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{node.usedIn.map((f) => (\n\t\t\t\t\t\t\t\t\t\t<li key={f.componentPath}>\n\t\t\t\t\t\t\t\t\t\t\t<code>{f.componentPath}</code>\n\t\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</details>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n"],"mappings":";;;;;AAGA,MAAM,cAAc;AAEpB,SAAgB,YAAY;CAC3B,MAAM,CAAC,OAAO,gCAAmC,KAAK;CACtD,MAAM,CAAC,GAAG,4BAAiB,GAAG;CAC9B,MAAM,CAAC,KAAK,8BAAkC,KAAK;AAEnD,4BAAgB;EACf,IAAI,QAAQ;AACX,GAAC,YAAY;AACb,OAAI;IACH,MAAM,MAAM,MAAM,MAAM,YAAY;AACpC,QAAI,CAAC,IAAI,GAAI,OAAM,IAAI,MAAM,QAAQ,IAAI,SAAS;IAClD,MAAM,OAAQ,MAAM,IAAI,MAAM;AAC9B,QAAI,MAAO,UAAS,KAAK;YACjB,GAAQ;AAChB,QAAI,MAAO,QAAO,GAAG,WAAW,OAAO,EAAE,CAAC;;MAExC;AACJ,eAAa;AACZ,WAAQ;;IAEP,EAAE,CAAC;AAEN,KAAI,IAAK,QAAO,4CAAC,kBAAE,wCAAqC,OAAQ;AAChE,KAAI,CAAC,MAAO,QAAO,2CAAC,iBAAE,8BAA6B;CAEnD,MAAM,UAAU,OAAO,QAAQ,MAAM,CACnC,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC,CAC1D,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,cAAc,EAAE,CAAC;AAExC,QACC,4CAAC;EAAI,OAAO;GAAE,SAAS;GAAI,SAAS;GAAQ,KAAK;GAAI;;GACpD,2CAAC;IACA,aAAY;IACZ,OAAO;IACP,WAAW,MAAM,KAAK,EAAE,OAAO,MAAM;IACrC,OAAO;KAAE,SAAS;KAAG,MAAM;KAAW;KACrC;GACF,4CAAC;IAAI,OAAO;KAAE,UAAU;KAAI,SAAS;KAAK;;KACxC,QAAQ;KAAO;KAAK,OAAO,KAAK,MAAM,CAAC;KAAO;;KAC1C;GACN,2CAAC;IAAI,OAAO;KAAE,SAAS;KAAQ,KAAK;KAAI;cACtC,QAAQ,KAAK,CAAC,MAAM,UACpB,4CAAC,wBACA,2CAAC,uBACA,2CAAC,oBAAM,OAAY,GACV,EACV,4CAAC;KACA,OAAO;MACN,SAAS;MACT,KAAK;MACL,SAAS;MACT;gBAED,4CAAC,oBACA,2CAAC,sBAAO,eAAmB,EAC3B,2CAAC,kBACC,KAAK,UAAU,KAAK,MACpB,2CAAC,kBACA,2CAAC,oBAAM,EAAE,gBAAqB,IADtB,EAAE,cAEN,CACJ,GACE,IACA,EACN,4CAAC,oBACA,2CAAC,sBAAO,YAAgB,EACxB,2CAAC,kBACC,KAAK,OAAO,KAAK,MACjB,2CAAC,kBACA,2CAAC,oBAAM,EAAE,gBAAqB,IADtB,EAAE,cAEN,CACJ,GACE,IACA;MACD,KA/BO,KAgCJ,CACT;KACG;;GACD"}

package/dist/panels/GraphView.d.cts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/panels/GraphView.d.ts
+declare function GraphView(): react_jsx_runtime1.JSX.Element;
+//#endregion
+export { GraphView };
+//# sourceMappingURL=GraphView.d.cts.map

package/dist/panels/GraphView.d.mts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/panels/GraphView.d.ts
+declare function GraphView(): react_jsx_runtime1.JSX.Element;
+//#endregion
+export { GraphView };
+//# sourceMappingURL=GraphView.d.mts.map

package/dist/panels/GraphView.mjs

@@ -0,0 +1,77 @@
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/panels/GraphView.tsx
+const DEFAULT_URL = "/dependency-previews.json";
+function GraphView() {
+	const [graph, setGraph] = useState(null);
+	const [q, setQ] = useState("");
+	const [err, setErr] = useState(null);
+	useEffect(() => {
+		let alive = true;
+		(async () => {
+			try {
+				const res = await fetch(DEFAULT_URL);
+				if (!res.ok) throw new Error(`HTTP ${res.status}`);
+				const json = await res.json();
+				if (alive) setGraph(json);
+			} catch (e) {
+				if (alive) setErr(e?.message || String(e));
+			}
+		})();
+		return () => {
+			alive = false;
+		};
+	}, []);
+	if (err) return /* @__PURE__ */ jsxs("p", { children: ["Failed to load dependency previews: ", err] });
+	if (!graph) return /* @__PURE__ */ jsx("p", { children: "Loading dependency graph…" });
+	const entries = Object.entries(graph).filter(([k]) => k.toLowerCase().includes(q.toLowerCase())).sort(([a], [b]) => a.localeCompare(b));
+	return /* @__PURE__ */ jsxs("div", {
+		style: {
+			padding: 12,
+			display: "grid",
+			gap: 12
+		},
+		children: [
+			/* @__PURE__ */ jsx("input", {
+				placeholder: "Filter by file path",
+				value: q,
+				onChange: (e) => setQ(e.target.value),
+				style: {
+					padding: 6,
+					font: "inherit"
+				}
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				style: {
+					fontSize: 12,
+					opacity: .7
+				},
+				children: [
+					entries.length,
+					" of ",
+					Object.keys(graph).length,
+					" components"
+				]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					display: "grid",
+					gap: 10
+				},
+				children: entries.map(([file, node]) => /* @__PURE__ */ jsxs("details", { children: [/* @__PURE__ */ jsx("summary", { children: /* @__PURE__ */ jsx("code", { children: file }) }), /* @__PURE__ */ jsxs("div", {
+					style: {
+						display: "grid",
+						gap: 6,
+						padding: "6px 0 0"
+					},
+					children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("strong", { children: "Built with" }), /* @__PURE__ */ jsx("ul", { children: node.builtWith.map((f) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("code", { children: f.componentPath }) }, f.componentPath)) })] }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("strong", { children: "Used in" }), /* @__PURE__ */ jsx("ul", { children: node.usedIn.map((f) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("code", { children: f.componentPath }) }, f.componentPath)) })] })]
+				})] }, file))
+			})
+		]
+	});
+}
+
+//#endregion
+export { GraphView };
+//# sourceMappingURL=GraphView.mjs.map

package/dist/panels/GraphView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraphView.mjs","names":[],"sources":["../../src/panels/GraphView.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\nimport type { Graph } from '../types'\n\nconst DEFAULT_URL = '/dependency-previews.json'\n\nexport function GraphView() {\n\tconst [graph, setGraph] = useState<Graph | null>(null)\n\tconst [q, setQ] = useState('')\n\tconst [err, setErr] = useState<string | null>(null)\n\n\tuseEffect(() => {\n\t\tlet alive = true\n\t\t;(async () => {\n\t\t\ttry {\n\t\t\t\tconst res = await fetch(DEFAULT_URL)\n\t\t\t\tif (!res.ok) throw new Error(`HTTP ${res.status}`)\n\t\t\t\tconst json = (await res.json()) as Graph\n\t\t\t\tif (alive) setGraph(json)\n\t\t\t} catch (e: any) {\n\t\t\t\tif (alive) setErr(e?.message || String(e))\n\t\t\t}\n\t\t})()\n\t\treturn () => {\n\t\t\talive = false\n\t\t}\n\t}, [])\n\n\tif (err) return <p>Failed to load dependency previews: {err}</p>\n\tif (!graph) return <p>Loading dependency graph…</p>\n\n\tconst entries = Object.entries(graph)\n\t\t.filter(([k]) => k.toLowerCase().includes(q.toLowerCase()))\n\t\t.sort(([a], [b]) => a.localeCompare(b))\n\n\treturn (\n\t\t<div style={{ padding: 12, display: 'grid', gap: 12 }}>\n\t\t\t<input\n\t\t\t\tplaceholder=\"Filter by file path\"\n\t\t\t\tvalue={q}\n\t\t\t\tonChange={(e) => setQ(e.target.value)}\n\t\t\t\tstyle={{ padding: 6, font: 'inherit' }}\n\t\t\t/>\n\t\t\t<div style={{ fontSize: 12, opacity: 0.7 }}>\n\t\t\t\t{entries.length} of {Object.keys(graph).length} components\n\t\t\t</div>\n\t\t\t<div style={{ display: 'grid', gap: 10 }}>\n\t\t\t\t{entries.map(([file, node]) => (\n\t\t\t\t\t<details key={file}>\n\t\t\t\t\t\t<summary>\n\t\t\t\t\t\t\t<code>{file}</code>\n\t\t\t\t\t\t</summary>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'grid',\n\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\tpadding: '6px 0 0',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<strong>Built with</strong>\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{node.builtWith.map((f) => (\n\t\t\t\t\t\t\t\t\t\t<li key={f.componentPath}>\n\t\t\t\t\t\t\t\t\t\t\t<code>{f.componentPath}</code>\n\t\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<strong>Used in</strong>\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{node.usedIn.map((f) => (\n\t\t\t\t\t\t\t\t\t\t<li key={f.componentPath}>\n\t\t\t\t\t\t\t\t\t\t\t<code>{f.componentPath}</code>\n\t\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</details>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n"],"mappings":";;;;AAGA,MAAM,cAAc;AAEpB,SAAgB,YAAY;CAC3B,MAAM,CAAC,OAAO,YAAY,SAAuB,KAAK;CACtD,MAAM,CAAC,GAAG,QAAQ,SAAS,GAAG;CAC9B,MAAM,CAAC,KAAK,UAAU,SAAwB,KAAK;AAEnD,iBAAgB;EACf,IAAI,QAAQ;AACX,GAAC,YAAY;AACb,OAAI;IACH,MAAM,MAAM,MAAM,MAAM,YAAY;AACpC,QAAI,CAAC,IAAI,GAAI,OAAM,IAAI,MAAM,QAAQ,IAAI,SAAS;IAClD,MAAM,OAAQ,MAAM,IAAI,MAAM;AAC9B,QAAI,MAAO,UAAS,KAAK;YACjB,GAAQ;AAChB,QAAI,MAAO,QAAO,GAAG,WAAW,OAAO,EAAE,CAAC;;MAExC;AACJ,eAAa;AACZ,WAAQ;;IAEP,EAAE,CAAC;AAEN,KAAI,IAAK,QAAO,qBAAC,kBAAE,wCAAqC,OAAQ;AAChE,KAAI,CAAC,MAAO,QAAO,oBAAC,iBAAE,8BAA6B;CAEnD,MAAM,UAAU,OAAO,QAAQ,MAAM,CACnC,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC,CAC1D,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,cAAc,EAAE,CAAC;AAExC,QACC,qBAAC;EAAI,OAAO;GAAE,SAAS;GAAI,SAAS;GAAQ,KAAK;GAAI;;GACpD,oBAAC;IACA,aAAY;IACZ,OAAO;IACP,WAAW,MAAM,KAAK,EAAE,OAAO,MAAM;IACrC,OAAO;KAAE,SAAS;KAAG,MAAM;KAAW;KACrC;GACF,qBAAC;IAAI,OAAO;KAAE,UAAU;KAAI,SAAS;KAAK;;KACxC,QAAQ;KAAO;KAAK,OAAO,KAAK,MAAM,CAAC;KAAO;;KAC1C;GACN,oBAAC;IAAI,OAAO;KAAE,SAAS;KAAQ,KAAK;KAAI;cACtC,QAAQ,KAAK,CAAC,MAAM,UACpB,qBAAC,wBACA,oBAAC,uBACA,oBAAC,oBAAM,OAAY,GACV,EACV,qBAAC;KACA,OAAO;MACN,SAAS;MACT,KAAK;MACL,SAAS;MACT;gBAED,qBAAC,oBACA,oBAAC,sBAAO,eAAmB,EAC3B,oBAAC,kBACC,KAAK,UAAU,KAAK,MACpB,oBAAC,kBACA,oBAAC,oBAAM,EAAE,gBAAqB,IADtB,EAAE,cAEN,CACJ,GACE,IACA,EACN,qBAAC,oBACA,oBAAC,sBAAO,YAAgB,EACxB,oBAAC,kBACC,KAAK,OAAO,KAAK,MACjB,oBAAC,kBACA,oBAAC,oBAAM,EAAE,gBAAqB,IADtB,EAAE,cAEN,CACJ,GACE,IACA;MACD,KA/BO,KAgCJ,CACT;KACG;;GACD"}

package/dist/panels/index.cjs

@@ -0,0 +1,3 @@
+const require_DependencyPreviews = require('../blocks/DependencyPreviews.cjs');
+const require_DefaultAutoDocsLayout = require('./DefaultAutoDocsLayout.cjs');
+const require_GraphView = require('./GraphView.cjs');

package/dist/panels/index.d.cts

@@ -0,0 +1,3 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.cjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./DefaultAutoDocsLayout.cjs";
+import { GraphView } from "./GraphView.cjs";

package/dist/panels/index.d.mts

@@ -0,0 +1,3 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.mjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./DefaultAutoDocsLayout.mjs";
+import { GraphView } from "./GraphView.mjs";

package/dist/panels/index.mjs

@@ -0,0 +1,3 @@
+import { DependencyPreviews } from "../blocks/DependencyPreviews.mjs";
+import { DefaultAutoDocsLayout, defaultPreviewParameters } from "./DefaultAutoDocsLayout.mjs";
+import { GraphView } from "./GraphView.mjs";

package/dist/preview.cjs

@@ -0,0 +1,23 @@
+const require_runtime = require('./_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+require("@iframe-resizer/child");
+
+//#region src/preview.tsx
+const decorators = [(Story) => {
+	const ref = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		ref.current?.parentElement?.setAttribute("data-iframe-size", "true");
+	}, []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "iframe-size-child",
+		ref,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Story, {})
+	});
+}];
+const dependencyPreviewDecorators = decorators;
+
+//#endregion
+exports.decorators = decorators;
+exports.dependencyPreviewDecorators = dependencyPreviewDecorators;
+//# sourceMappingURL=preview.cjs.map

package/dist/preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview.cjs","names":[],"sources":["../src/preview.tsx"],"sourcesContent":["// This runs in the Storybook preview (the iframe)\nimport '@iframe-resizer/child'\nimport { useEffect, useRef } from 'react'\nimport type { PartialStoryFn } from 'storybook/internal/csf'\n\nexport const decorators = [\n\t(Story: PartialStoryFn) => {\n\t\tconst ref = useRef<HTMLDivElement>(null)\n\n\t\tuseEffect(() => {\n\t\t\tref.current?.parentElement?.setAttribute('data-iframe-size', 'true')\n\t\t}, [])\n\n\t\treturn (\n\t\t\t<div className=\"iframe-size-child\" ref={ref}>\n\t\t\t\t<Story />\n\t\t\t</div>\n\t\t)\n\t},\n]\n\nexport const dependencyPreviewDecorators = decorators\n"],"mappings":";;;;;;AAKA,MAAa,aAAa,EACxB,UAA0B;CAC1B,MAAM,wBAA6B,KAAK;AAExC,4BAAgB;AACf,MAAI,SAAS,eAAe,aAAa,oBAAoB,OAAO;IAClE,EAAE,CAAC;AAEN,QACC,2CAAC;EAAI,WAAU;EAAyB;YACvC,2CAAC,UAAQ;GACJ;EAGR;AAED,MAAa,8BAA8B"}

package/dist/preview.d.cts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { PartialStoryFn } from "storybook/internal/csf";
+
+//#region src/preview.d.ts
+declare const decorators: ((Story: PartialStoryFn) => react_jsx_runtime0.JSX.Element)[];
+declare const dependencyPreviewDecorators: ((Story: PartialStoryFn) => react_jsx_runtime0.JSX.Element)[];
+//#endregion
+export { decorators, dependencyPreviewDecorators };
+//# sourceMappingURL=preview.d.cts.map

package/dist/preview.d.mts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import "@iframe-resizer/child";
+import { PartialStoryFn } from "storybook/internal/csf";
+
+//#region src/preview.d.ts
+declare const decorators: ((Story: PartialStoryFn) => react_jsx_runtime0.JSX.Element)[];
+declare const dependencyPreviewDecorators: ((Story: PartialStoryFn) => react_jsx_runtime0.JSX.Element)[];
+//#endregion
+export { decorators, dependencyPreviewDecorators };
+//# sourceMappingURL=preview.d.mts.map

package/dist/preview.mjs

@@ -0,0 +1,21 @@
+import { useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import "@iframe-resizer/child";
+
+//#region src/preview.tsx
+const decorators = [(Story) => {
+	const ref = useRef(null);
+	useEffect(() => {
+		ref.current?.parentElement?.setAttribute("data-iframe-size", "true");
+	}, []);
+	return /* @__PURE__ */ jsx("div", {
+		className: "iframe-size-child",
+		ref,
+		children: /* @__PURE__ */ jsx(Story, {})
+	});
+}];
+const dependencyPreviewDecorators = decorators;
+
+//#endregion
+export { decorators, dependencyPreviewDecorators };
+//# sourceMappingURL=preview.mjs.map