@mintlify/previewing 4.0.1462 → 4.0.1463

package/dist/__tests__/packages-flag.test.d.ts

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

package/dist/__tests__/packages-flag.test.js

@@ -0,0 +1,146 @@
+import { prebuild } from '@mintlify/prebuild';
+import { mockProcessExit } from 'vitest-mock-process';
+import { configurePreviewPath } from '../constants.js';
+import { dev, isNativePackagesEnabled } from '../index.js';
+import listener from '../local-preview/listener/index.js';
+import { packageRoute, setPackagesRebuiltListener, startPackagesDev, } from '../local-preview/packages/index.js';
+const captured = vi.hoisted(() => ({ app: undefined }));
+vi.mock('http', async (importOriginal) => {
+    const actual = await importOriginal();
+    const createServer = (app) => {
+        captured.app = app;
+        return { listen: vi.fn() };
+    };
+    return { ...actual, default: { ...actual, createServer }, createServer };
+});
+vi.mock('socket.io', () => ({
+    Server: vi.fn(() => ({ emit: vi.fn(), on: vi.fn() })),
+}));
+vi.mock('fs-extra', () => {
+    const mocks = {
+        ensureDir: vi.fn().mockResolvedValue(undefined),
+        pathExists: vi.fn().mockResolvedValue(true),
+        readFileSync: vi.fn().mockReturnValue('0.0.100'),
+        emptyDirSync: vi.fn(),
+        outputFileSync: vi.fn(),
+    };
+    return { ...mocks, default: mocks };
+});
+vi.mock('@mintlify/prebuild', () => ({
+    prebuild: vi.fn().mockResolvedValue(undefined),
+    getFileListSync: vi.fn().mockReturnValue([]),
+}));
+vi.mock('is-online', () => ({ default: vi.fn().mockResolvedValue(true) }));
+vi.mock('../local-preview/update.js', () => ({
+    silentUpdateClient: vi.fn().mockResolvedValue({ needsUpdate: false, error: undefined }),
+}));
+vi.mock('../local-preview/preview-lock.js', () => ({
+    acquirePreviewLock: vi.fn().mockReturnValue(vi.fn()),
+}));
+vi.mock('../util.js', () => ({
+    maybeFixMissingWindowsEnvVar: vi.fn(),
+    seedPreviewFromShared: vi.fn(),
+}));
+vi.mock('../local-preview/run.js', () => ({ run: vi.fn().mockResolvedValue(undefined) }));
+vi.mock('../local-preview/setupNext.js', () => ({
+    setupNext: vi.fn(async () => (_req, res) => {
+        res.end('next');
+    }),
+}));
+vi.mock('../local-preview/listener/index.js', () => ({
+    default: vi.fn(),
+    initializeImportCache: vi.fn(),
+    initializeFrontmatterHashCache: vi.fn(),
+    initializeDocsConfigHashCache: vi.fn(),
+}));
+vi.mock('../local-preview/listener/referencedFiles.js', () => ({
+    refreshTrackedReferencedFiles: vi.fn(),
+}));
+vi.mock('../local-preview/on-demand-page.js', () => ({
+    ensurePageCompiled: vi.fn().mockResolvedValue(undefined),
+    getFailedCompileEvents: vi.fn().mockReturnValue([]),
+    markOnDemandPagesReady: vi.fn(),
+    setCompileListener: vi.fn(),
+}));
+vi.mock('../local-preview/packages/index.js', () => ({
+    startPackagesDev: vi.fn().mockResolvedValue(undefined),
+    setPackagesRebuiltListener: vi.fn(),
+    packageRoute: {
+        prefix: '/_mintlify/pkg',
+        handler: vi.fn((_req, res) => res.end('pkg')),
+    },
+}));
+const originalChdir = process.chdir;
+const processExitMock = mockProcessExit();
+const argv = { _: [], $0: '', packageName: 'mint', cliVersion: '1.0.0' };
+const setFlag = (value) => vi.stubEnv('MINTLIFY_NATIVE_NPM_PACKAGES', value);
+const startRun = async () => {
+    const { run } = await vi.importActual('../local-preview/run.js');
+    await run({ ...argv, needsUpdate: false });
+};
+const get = async (path) => {
+    const { createServer } = await vi.importActual('http');
+    const server = createServer(captured.app);
+    await new Promise((resolve) => server.listen(0, '127.0.0.1', resolve));
+    try {
+        const { port } = server.address();
+        return await (await fetch(`http://127.0.0.1:${port}${path}`)).text();
+    }
+    finally {
+        await new Promise((resolve) => server.close(resolve));
+    }
+};
+beforeEach(() => {
+    vi.clearAllMocks();
+    process.chdir = vi.fn();
+    captured.app = undefined;
+});
+afterEach(() => {
+    process.chdir = originalChdir;
+    vi.unstubAllEnvs();
+});
+describe('isNativePackagesEnabled', () => {
+    it('is on only when MINTLIFY_NATIVE_NPM_PACKAGES is 1', () => {
+        setFlag(undefined);
+        expect(isNativePackagesEnabled()).toBe(false);
+        setFlag('true');
+        expect(isNativePackagesEnabled()).toBe(false);
+        setFlag('0');
+        expect(isNativePackagesEnabled()).toBe(false);
+        setFlag('1');
+        expect(isNativePackagesEnabled()).toBe(true);
+    });
+});
+describe('mint dev with native npm packages off', () => {
+    beforeEach(() => setFlag(undefined));
+    it('skips the packages runtime and tells prebuild to ignore packages', async () => {
+        await dev(argv);
+        expect(processExitMock).not.toHaveBeenCalled();
+        expect(startPackagesDev).not.toHaveBeenCalled();
+        expect(prebuild).toHaveBeenCalledWith(expect.any(String), expect.objectContaining({ nativePackages: false }));
+    });
+    it('lets /_mintlify/pkg requests fall through to the next handler', async () => {
+        configurePreviewPath(3000);
+        await startRun();
+        expect(await get('/_mintlify/pkg/x/client/a.js')).toBe('next');
+        expect(packageRoute.handler).not.toHaveBeenCalled();
+        expect(setPackagesRebuiltListener).not.toHaveBeenCalled();
+        expect(listener).toHaveBeenCalledWith(expect.any(Function), expect.objectContaining({ nativePackages: false }), expect.any(Promise));
+    });
+});
+describe('mint dev with MINTLIFY_NATIVE_NPM_PACKAGES=1', () => {
+    beforeEach(() => setFlag('1'));
+    it('starts the packages runtime and tells prebuild to read packages', async () => {
+        await dev(argv);
+        expect(processExitMock).not.toHaveBeenCalled();
+        expect(startPackagesDev).toHaveBeenCalledOnce();
+        expect(prebuild).toHaveBeenCalledWith(expect.any(String), expect.objectContaining({ nativePackages: true }));
+    });
+    it('serves /_mintlify/pkg from the package route', async () => {
+        configurePreviewPath(3000);
+        await startRun();
+        expect(await get('/_mintlify/pkg/x/client/a.js')).toBe('pkg');
+        expect(setPackagesRebuiltListener).toHaveBeenCalledWith(expect.any(Function));
+        expect(listener).toHaveBeenCalledWith(expect.any(Function), expect.objectContaining({ nativePackages: true }), expect.any(Promise));
+    });
+});

package/dist/__tests__/packages-imports.test.d.ts

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

package/dist/__tests__/packages-imports.test.js

@@ -0,0 +1,68 @@
+import { findAndRemoveImports, getAST, stringifyTree } from '@mintlify/common';
+import fse from 'fs-extra';
+import { mkdtemp, rm } from 'fs/promises';
+import { tmpdir } from 'os';
+import { join } from 'path';
+const testPaths = vi.hoisted(() => ({ cmd: '', public: '' }));
+vi.mock('../constants.js', () => ({
+    get CMD_EXEC_PATH() {
+        return testPaths.cmd;
+    },
+    get NEXT_PUBLIC_PATH() {
+        return testPaths.public;
+    },
+}));
+vi.mock('../local-preview/listener/utils.js', () => ({
+    getCurrentVariables: vi.fn(async () => ({})),
+    handleParseError: vi.fn(),
+}));
+import { resolvePageImports } from '../local-preview/listener/resolve-page-imports.js';
+import { setPackageImportOptions } from '../local-preview/packages/state.js';
+const PAGE = `import { LineChart } from "recharts";
+import { Toggle } from "/snippets/toggle.jsx";
+import { Note } from "/snippets/note.mdx";
+
+<LineChart width={400} height={200} />
+
+<Toggle />
+
+<Note />
+`;
+const resolve = async () => {
+    const importsResponse = await findAndRemoveImports(getAST(PAGE, '/page.mdx'));
+    return stringifyTree(await resolvePageImports({ ...importsResponse, filename: 'page.mdx' }));
+};
+describe('page imports in mint dev with npm packages', () => {
+    let root;
+    beforeEach(async () => {
+        root = await mkdtemp(join(tmpdir(), 'packages-imports-'));
+        testPaths.cmd = join(root, 'docs');
+        testPaths.public = join(root, 'public');
+        await fse.ensureDir(testPaths.public);
+        await fse.outputFile(join(testPaths.cmd, 'snippets/toggle.jsx'), 'import { Switch } from "@acme/ui";\nexport const Toggle = () => <Switch />;\n');
+        await fse.outputFile(join(testPaths.cmd, 'snippets/note.mdx'), 'export const Note = () => <p>Hi</p>;\n');
+        vi.spyOn(console, 'log').mockImplementation(() => { });
+    });
+    afterEach(async () => {
+        setPackageImportOptions(undefined);
+        vi.mocked(console.log).mockRestore();
+        await rm(root, { recursive: true, force: true });
+    });
+    it('strips package imports when packages are off', async () => {
+        const output = await resolve();
+        expect(output).not.toContain('import');
+        expect(output).toContain('export const Toggle');
+        expect(output).toContain('export const Note');
+    });
+    it('keeps package and package snippet imports when packages are on', async () => {
+        setPackageImportOptions({
+            packageNames: new Set(['recharts', '@acme/ui']),
+            packageSnippets: new Set(['/snippets/toggle.jsx']),
+        });
+        const output = await resolve();
+        expect(output).toContain('import {LineChart} from "recharts";');
+        expect(output).toContain('import {Toggle} from "/snippets/toggle.jsx";');
+        expect(output).not.toContain('export const Toggle');
+        expect(output).toContain('export const Note');
+    });
+});

package/dist/__tests__/packages-island-errors.test.d.ts

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

package/dist/__tests__/packages-island-errors.test.js

@@ -0,0 +1,128 @@
+import { getFileCategory } from '@mintlify/common';
+import fse from 'fs-extra';
+import { join } from 'path';
+vi.mock('../constants.js', async (importOriginal) => {
+    const actual = await importOriginal();
+    const { mkdtempSync } = await import('fs');
+    const { tmpdir } = await import('os');
+    const path = await import('path');
+    const root = mkdtempSync(path.join(tmpdir(), 'packages-island-errors-'));
+    return {
+        ...actual,
+        CMD_EXEC_PATH: path.join(root, 'docs'),
+        PREVIEW_PATH: path.join(root, 'preview'),
+        NEXT_PROPS_PATH: path.join(root, 'props'),
+    };
+});
+vi.mock('../local-preview/listener/regenerateAllSnippets.js', () => ({
+    regenerateAllSnippets: vi.fn().mockResolvedValue([]),
+}));
+vi.mock('@mintlify/package-builder', async (importOriginal) => {
+    const actual = await importOriginal();
+    const build = async () => ({
+        ok: true,
+        manifest: {
+            version: 1,
+            builderVersion: 'test',
+            buildId: 'b',
+            depsHash: 'd',
+            islandsHash: 'i',
+            react: { version: '18.3.1', domVersion: '18.3.1' },
+            packages: {},
+            css: [],
+            islands: {},
+            files: [],
+            diagnostics: [],
+        },
+        localFiles: [],
+        missingLocalFiles: [],
+        stats: {},
+    });
+    return { ...actual, build };
+});
+import { CMD_EXEC_PATH } from '../constants.js';
+import { notifyPackageInputChange, startPackagesDev } from '../local-preview/packages/index.js';
+import { clearErrorLogs, getCurrentErrorLogs, setLoggingCallbacks } from '../logging-state.js';
+const BROKEN = 'import { LineChart } from "recharts";\n\n<LineChart onClick={() => {}} />\n';
+const FIXED = 'import { LineChart } from "recharts";\n\n<LineChart width={400} />\n';
+const errorMessages = () => getCurrentErrorLogs().map((log) => log.props.message);
+const islandErrorCount = () => errorMessages().filter((message) => /^npm packages: bad\.mdx:3 /.test(message)).length;
+const packageErrors = () => errorMessages().filter((message) => message.startsWith('npm packages:'));
+const save = async (filename, content) => {
+    clearErrorLogs();
+    if (content !== undefined)
+        await fse.outputFile(join(CMD_EXEC_PATH, filename), content);
+    await notifyPackageInputChange(filename, getFileCategory(filename));
+};
+describe('npm package island errors in the mint dev log', () => {
+    beforeAll(() => {
+        setLoggingCallbacks(() => { }, () => { }, () => { });
+    });
+    beforeEach(async () => {
+        await fse.emptyDir(CMD_EXEC_PATH);
+        await fse.outputJson(join(CMD_EXEC_PATH, 'docs.json'), { name: 'Docs', packages: {} });
+        await fse.outputJson(join(CMD_EXEC_PATH, 'package.json'), {
+            dependencies: { recharts: '2.15.4' },
+        });
+        await fse.outputFile(join(CMD_EXEC_PATH, 'bad.mdx'), BROKEN);
+        await fse.outputFile(join(CMD_EXEC_PATH, 'other.mdx'), '# Other\n');
+        await fse.outputFile(join(CMD_EXEC_PATH, 'styles.css'), 'a{}');
+        clearErrorLogs();
+        await startPackagesDev();
+        expect(islandErrorCount()).toBe(1);
+    });
+    afterEach(async () => {
+        await fse.remove(join(CMD_EXEC_PATH, 'docs.json'));
+        await startPackagesDev();
+        clearErrorLogs();
+    });
+    it('keeps them after another page is saved, without repeating them', async () => {
+        await save('other.mdx', '# Other edited\n');
+        expect(islandErrorCount()).toBe(1);
+        await notifyPackageInputChange('other.mdx', 'page');
+        expect(islandErrorCount()).toBe(1);
+        await save('other.mdx', '# Other edited again\n');
+        expect(islandErrorCount()).toBe(1);
+    });
+    it('keeps them after a file that is not a page is saved', async () => {
+        await save('styles.css', 'b{}');
+        expect(islandErrorCount()).toBe(1);
+    });
+    it('keeps them next to the config error while docs.json does not parse', async () => {
+        await save('docs.json', '{ "name": "Docs", "packages": {');
+        expect(errorMessages()).toContainEqual(expect.stringMatching(/^npm packages: docs\.json could not be loaded/));
+        expect(islandErrorCount()).toBe(1);
+    });
+    it('drops them once the island is fixed and shows them again when it breaks the same way', async () => {
+        await save('bad.mdx', FIXED);
+        expect(errorMessages()).toEqual([]);
+        await save('bad.mdx', BROKEN);
+        expect(islandErrorCount()).toBe(1);
+    });
+    it('drops them when the island is fixed while another page saves at the same time', async () => {
+        clearErrorLogs();
+        await fse.outputFile(join(CMD_EXEC_PATH, 'bad.mdx'), FIXED);
+        await fse.outputFile(join(CMD_EXEC_PATH, 'other.mdx'), '# Other edited\n');
+        await Promise.all([
+            notifyPackageInputChange('other.mdx', 'page'),
+            notifyPackageInputChange('bad.mdx', 'page'),
+        ]);
+        expect(errorMessages()).toEqual([]);
+    });
+    it('drops them when the island is fixed while a stylesheet saves at the same time', async () => {
+        clearErrorLogs();
+        await fse.outputFile(join(CMD_EXEC_PATH, 'bad.mdx'), FIXED);
+        await Promise.all([
+            notifyPackageInputChange('bad.mdx', 'page'),
+            notifyPackageInputChange('styles.css', getFileCategory('styles.css')),
+        ]);
+        expect(errorMessages()).toEqual([]);
+    });
+    it('replaces them when a broken page is deleted', async () => {
+        await save('worse.mdx', BROKEN);
+        expect(packageErrors()).toHaveLength(2);
+        await fse.remove(join(CMD_EXEC_PATH, 'bad.mdx'));
+        await notifyPackageInputChange('bad.mdx', 'page');
+        expect(packageErrors()).toEqual([expect.stringMatching(/^npm packages: worse\.mdx:3 /)]);
+    });
+});

package/dist/__tests__/packages-serve.test.d.ts

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

package/dist/__tests__/packages-serve.test.js

@@ -0,0 +1,73 @@
+import express from 'express';
+import fse from 'fs-extra';
+import { mkdtemp, rm } from 'fs/promises';
+import { createServer } from 'http';
+import { tmpdir } from 'os';
+import { join } from 'path';
+import { createPackageRoute, EMPTY_ISLAND_MODULE, PACKAGE_ROUTE_PREFIX, } from '../local-preview/packages/serve.js';
+const BUILD = 'a'.repeat(32);
+describe('package route', () => {
+    let root;
+    let server;
+    let base;
+    let state;
+    beforeEach(async () => {
+        root = await mkdtemp(join(tmpdir(), 'packages-serve-'));
+        const buildsDir = join(root, '.mintlify', 'packages');
+        await fse.outputFile(join(buildsDir, BUILD, 'client/islands/i0123456789abcdef.js'), 'export {}');
+        await fse.outputFile(join(buildsDir, BUILD, 'client/chunk-AB12.js'), 'export const a = 1;');
+        await fse.outputFile(join(buildsDir, BUILD, 'manifest.json'), '{"islands":{}}');
+        await fse.outputFile(join(buildsDir, BUILD, 'server/islands/x.js'), 'secret');
+        await fse.outputFile(join(root, 'outside.js'), 'outside');
+        state = { enabled: true, buildsDir };
+        const app = express();
+        app.use(PACKAGE_ROUTE_PREFIX, createPackageRoute(() => state));
+        app.use((_req, res) => {
+            res.status(418).send('next');
+        });
+        server = createServer(app);
+        await new Promise((resolve) => server.listen(0, resolve));
+        base = `http://127.0.0.1:${server.address().port}${PACKAGE_ROUTE_PREFIX}`;
+    });
+    afterEach(async () => {
+        await new Promise((resolve) => server.close(resolve));
+        await rm(root, { recursive: true, force: true });
+    });
+    it('serves client files from a build under a dot folder', async () => {
+        const res = await fetch(`${base}/${BUILD}/client/islands/i0123456789abcdef.js`);
+        expect(res.status).toBe(200);
+        expect(res.headers.get('content-type')).toMatch(/javascript/);
+        expect(res.headers.get('x-content-type-options')).toBe('nosniff');
+        expect(res.headers.get('cache-control')).toBe('no-cache');
+        expect(await res.text()).toBe('export {}');
+        expect((await fetch(`${base}/${BUILD}/client/chunk-AB12.js`)).status).toBe(200);
+    });
+    it('never serves the manifest, server bundles or paths outside client', async () => {
+        for (const path of [
+            `${BUILD}/manifest.json`,
+            `${BUILD}/server/islands/x.js`,
+            `${BUILD}/client/../manifest.json`,
+            `${BUILD}/client/%2e%2e/manifest.json`,
+            `${BUILD}/client/..%2f..%2f..%2f..%2foutside.js`,
+            `..%2f..%2foutside.js`,
+        ]) {
+            const res = await fetch(`${base}/${path}`);
+            expect(res.status, path).toBe(404);
+            expect(await res.text(), path).not.toMatch(/secret|outside|islands/);
+        }
+    });
+    it('answers a missing island entry with a module that renders nothing', async () => {
+        const res = await fetch(`${base}/pending/client/islands/i0000000000000000.js`);
+        expect(res.status).toBe(200);
+        expect(res.headers.get('content-type')).toMatch(/javascript/);
+        expect(res.headers.get('cache-control')).toBe('no-store');
+        expect(await res.text()).toBe(EMPTY_ISLAND_MODULE);
+        const mod = await import(`data:text/javascript,${encodeURIComponent(EMPTY_ISLAND_MODULE)}`);
+        expect(mod).toMatchObject({ hydrate: expect.any(Function) });
+    });
+    it('falls through to Next when packages are off', async () => {
+        state = { ...state, enabled: false };
+        const res = await fetch(`${base}/${BUILD}/client/islands/i0123456789abcdef.js`);
+        expect(res.status).toBe(418);
+    });
+});

package/dist/__tests__/packages-setup.test.js

@@ -3,9 +3,8 @@ import fse from 'fs-extra';
 import { mkdtemp, rm } from 'fs/promises';
 import { tmpdir } from 'os';
 import { join } from 'path';
-import { checkPackages } from '../packages/check.js';
 import { collectPackageIslands } from '../packages/collect.js';
-import { DocsJsonError, readPackagesSetup } from '../packages/setup.js';
+import { DocsJsonError, InvalidPackagesError, readPackagesSetup } from '../packages/setup.js';
 const PAGE = 'import { Button } from "@acme/ui";\n\n<Button label="{{label}}" />\n';
 describe('package setup config references', () => {
     let docsRoot;
@@ -90,13 +89,72 @@ describe('package setup config references', () => {
         if (content !== undefined)
             await fse.outputFile(join(docsRoot, file), content);
         await expect(readPackagesSetup(docsRoot)).rejects.toThrow(DocsJsonError);
-        const build = vi.fn();
-        const checked = await checkPackages({ docsRoot, build });
-        expect(checked.ok).toBe(false);
-        expect(checked.lines).toEqual([{ level: 'error', message: expect.stringMatching(message) }]);
-        expect(build).not.toHaveBeenCalled();
+        await expect(readPackagesSetup(docsRoot)).rejects.toThrow(message);
     });
     it('keeps packages disabled when docs.json is missing', async () => {
         expect(await readPackagesSetup(docsRoot)).toBeUndefined();
     });
+    it('keeps packages disabled without a packages key', async () => {
+        await fse.outputJson(join(docsRoot, 'docs.json'), { name: 'Docs' });
+        expect(await readPackagesSetup(docsRoot)).toBeUndefined();
+    });
+    it.each([
+        ['', 'docs.json could not be loaded: Unexpected end of JSON input'],
+        ['["packages"]', 'docs.json is not a JSON object'],
+    ])('rejects docs.json %j', async (raw, message) => {
+        await fse.outputFile(join(docsRoot, 'docs.json'), raw);
+        await expect(readPackagesSetup(docsRoot)).rejects.toEqual(new DocsJsonError([message]));
+    });
+    it.each([
+        ['', 'package.json is not valid JSON: Unexpected end of JSON input'],
+        ['["recharts"]', 'package.json is not a JSON object'],
+        ['null', 'package.json is not a JSON object'],
+    ])('reports package.json %j without package names', async (raw, message) => {
+        await fse.outputJson(join(docsRoot, 'docs.json'), { name: 'Docs', packages: {} });
+        await fse.outputFile(join(docsRoot, 'package.json'), raw);
+        const setup = await readPackagesSetup(docsRoot);
+        expect(setup?.errors).toEqual([message]);
+        expect(setup?.packageJsonError).toBe(message);
+        expect(setup?.packageNames).toEqual(new Set());
+    });
+    it.each([
+        ['a string', 'nope', ['docs.json packages: Expected object, received string']],
+        [
+            'an http registry',
+            { registries: { '@acme': 'http://npm.acme.com/' } },
+            [
+                'docs.json packages.registries.@acme: Registry URLs must start with `https://` and then the host',
+            ],
+        ],
+        [
+            'a provider outside the docs',
+            { provider: '../provider.jsx', isolation: 'none' },
+            [
+                'docs.json packages.provider: Provider path cannot contain `..` segments',
+                "docs.json packages.isolation: Invalid enum value. Expected 'page' | 'frame', received 'none'",
+            ],
+        ],
+    ])('rejects %s for packages with the schema errors and the variables', async (_, packages, errors) => {
+        await fse.outputJson(join(docsRoot, 'docs.json'), {
+            name: 'Docs',
+            packages,
+            variables: { label: 'Synthetic label' },
+        });
+        const error = await readPackagesSetup(docsRoot).catch((caught) => caught);
+        expect(error).toBeInstanceOf(InvalidPackagesError);
+        if (!(error instanceof InvalidPackagesError))
+            return;
+        expect(error.problems).toEqual(errors);
+        expect(error.variables).toEqual({ label: 'Synthetic label' });
+    });
+    it('reports errors in a snippet a page imports', async () => {
+        await fse.outputJson(join(docsRoot, 'docs.json'), { name: 'Docs', packages: {} });
+        await fse.outputFile(join(docsRoot, 'charts.mdx'), 'import { Chart } from "/snippets/chart.jsx";\n\n<Chart />\n');
+        await fse.outputFile(join(docsRoot, 'snippets/chart.jsx'), 'import { Button } from "@acme/ui";\n\nexport const Chart = () => <Button\n');
+        const collected = await collectPackageIslands({
+            docsRoot,
+            packageNames: new Set(['@acme/ui']),
+        });
+        expect(collected.errors.some(({ file }) => file === 'snippets/chart.jsx')).toBe(true);
+    });
 });

package/dist/local-preview/index.js

@@ -6,8 +6,10 @@ import pathUtil from 'path';
 import { CLIENT_PATH, CMD_EXEC_PATH, VERSION_PATH, NEXT_PUBLIC_PATH, NEXT_PROPS_PATH, PREVIEW_PATH, configurePreviewPath, } from '../constants.js';
 import { addLog, clearLogs } from '../logging-state.js';
 import { ErrorLog, SpinnerLog } from '../logs.js';
+import { isNativePackagesEnabled } from '../packages/flag.js';
 import { seedPreviewFromShared } from '../util.js';
 import { timeDev, timeDevSync } from './dev-timing.js';
+import { startPackagesDev } from './packages/index.js';
 import { acquirePreviewLock } from './preview-lock.js';
 import { run } from './run.js';
 import { silentUpdateClient } from './update.js';
@@ -88,6 +90,7 @@ const startDev = async (argv) => {
     timeDevSync('switch to local client directory', () => {
         process.chdir(CLIENT_PATH);
     });
+    const nativePackages = isNativePackagesEnabled();
     let fileImportsMap;
     try {
         const result = await timeDev('prebuild content', () => prebuild(CMD_EXEC_PATH, {
@@ -97,6 +100,7 @@ const startDev = async (argv) => {
             disablePrefetch,
             allowSourceRefs: true,
             lazyPages: true,
+            nativePackages,
         }));
         fileImportsMap = result?.fileImportsMap;
     }
@@ -107,6 +111,8 @@ const startDev = async (argv) => {
         await new Promise((resolve) => setTimeout(resolve, 50));
         process.exit(1);
     }
+    if (nativePackages)
+        await timeDev('build npm packages', () => startPackagesDev());
     await timeDev('start preview runtime', () => run({ ...argv, needsUpdate, fileImportsMap }));
 };
 const dev = async (argv) => {

package/dist/local-preview/listener/index.d.ts

@@ -6,6 +6,7 @@ type LocalPreviewOptions = {
     disablePrefetch?: boolean;
     allowSourceRefs?: boolean;
     lazyPages?: boolean;
+    nativePackages?: boolean;
 };
 declare const listener: (triggerRefresh: () => void, options?: LocalPreviewOptions, gate?: Promise<void>) => void;
 declare const initializeFrontmatterHashCache: () => Promise<void>;

package/dist/local-preview/listener/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { findAndRemoveImports, hasImports, getFileCategory, normalizeOverlayKey, toPosixPath, validate, stringifyTree, isMintIgnored, replaceVariables, } from '@mintlify/common';
+import { findAndRemoveImports, hasImports, getFileCategory, isPackageManifestPath, normalizeOverlayKey, toPosixPath, validate, stringifyTree, isMintIgnored, replaceVariables, } from '@mintlify/common';
 import { createPage, discoverOverlayFiles, getFileListSync, getMintIgnore, MintConfigUpdater, DocsConfigUpdater, preparseMdxTree, prebuild, } from '@mintlify/prebuild';
 import { isOverlayDocument } from '@mintlify/validation';
 import Chalk from 'chalk';
@@ -12,7 +12,9 @@ import pathUtil from 'path';
 import { CMD_EXEC_PATH, NEXT_PROPS_PATH, NEXT_PUBLIC_PATH, CLIENT_PATH } from '../../constants.js';
 import { addChangeLog, addErrorLog, clearErrorLogs, getCurrentErrorLogs, } from '../../logging-state.js';
 import { AddedLog, DeletedLog, EditedLog, WarningLog, InfoLog, ErrorLog } from '../../logs.js';
+import { isNativePackagesEnabled } from '../../packages/flag.js';
 import { reportPageCompileError, reportPageCompileSuccess } from '../on-demand-page.js';
+import { notifyPackageInputChange, writePackageBuildProps } from '../packages/index.js';
 import { clearDocsConfigCaches, getDocsConfigApiHash, getDocsConfigNavigationHash, getVariablesHash, hasDocsConfigApiChanged, hasDocsConfigNavigationChanged, hasNavigationApiReference, hadDocsConfigApiReference, hasDocsConfigVariablesChanged, updateDocsConfigHashCache, } from './docs-config-cache.js';
 import { generateDependentSnippets } from './generateDependentSnippets.js';
 import { generatePagesWithImports } from './generatePagesWithImports.js';
@@ -185,6 +187,7 @@ const onUnlinkEvent = async (filename, triggerRefresh, options) => {
     try {
         const importedFiles = getImportedFilesFromCache();
         const potentialCategory = getFileCategory(filename, { importedFiles });
+        await notifyPackageInputChange(filename, potentialCategory);
         frontmatterHashes.delete(filename);
         removePageMetadataCacheEntryForFile(filename);
         if (potentialCategory === 'page') {
@@ -274,6 +277,7 @@ const onUnlinkEvent = async (filename, triggerRefresh, options) => {
                     await fse.emptyDir(NEXT_PUBLIC_PATH);
                     await fse.emptyDir(NEXT_PROPS_PATH);
                     const prebuildResult = await prebuild(CMD_EXEC_PATH, options);
+                    await writePackageBuildProps();
                     await initializeImportCache(CMD_EXEC_PATH, prebuildResult?.fileImportsMap);
                     await initializeFrontmatterHashCache();
                     await refreshTrackedReferencedFiles();
@@ -384,6 +388,7 @@ const onUpdateEvent = async (filename, triggerRefresh, options = {}) => {
     clearErrorLogs();
     const filePath = pathUtil.join(CMD_EXEC_PATH, filename);
     if (shouldRegenerateGraphqlSource(filename)) {
+        await notifyPackageInputChange(filename, getFileCategory(filename, { importedFiles: getImportedFilesFromCache() }));
         await rebuildGraphqlSchema(triggerRefresh, options);
         return null;
     }
@@ -391,6 +396,9 @@ const onUpdateEvent = async (filename, triggerRefresh, options = {}) => {
     await syncImportedFileLocations(importChanges);
     const importedFiles = getImportedFilesFromCache();
     const potentialCategory = getFileCategory(filename, { importedFiles });
+    await notifyPackageInputChange(filename, potentialCategory);
+    if (isNativePackagesEnabled() && isPackageManifestPath(filename))
+        return null;
     if (hasTrackedReferencedFile(filename)) {
         if (await fse.pathExists(pathUtil.join(CMD_EXEC_PATH, 'docs.json'))) {
             return onUpdateEvent('docs.json', triggerRefresh, options);
@@ -586,6 +594,7 @@ const onUpdateEvent = async (filename, triggerRefresh, options = {}) => {
                 await fse.emptyDir(NEXT_PUBLIC_PATH);
                 await fse.emptyDir(NEXT_PROPS_PATH);
                 const prebuildResult = await prebuild(CMD_EXEC_PATH, options);
+                await writePackageBuildProps();
                 await initializeImportCache(CMD_EXEC_PATH, prebuildResult?.fileImportsMap);
                 await initializeFrontmatterHashCache();
                 await refreshTrackedReferencedFiles();

package/dist/local-preview/listener/regenerateAllSnippets.js

@@ -4,6 +4,7 @@ import { outputFile } from 'fs-extra';
 import { readFile } from 'fs/promises';
 import { join } from 'path';
 import { CMD_EXEC_PATH, NEXT_PUBLIC_PATH } from '../../constants.js';
+import { packageImportArgs } from '../packages/state.js';
 import { getImportedFilesFromCache } from './importCache.js';
 import { getCurrentVariables, getMintIgnoreGlobs, handleParseError } from './utils.js';
 const getV2SnippetFilenames = () => {
@@ -65,6 +66,7 @@ export const regenerateAllSnippets = async () => {
                 const resolvedTree = await baseResolveAllImports({
                     snippets: resolvedTrees,
                     fileWithImports: importData,
+                    ...packageImportArgs(),
                 });
                 await outputFile(join(NEXT_PUBLIC_PATH, targetFilename), stringifyTree(resolvedTree), {
                     flag: 'w',

package/dist/local-preview/listener/resolve-imports-from-import-closure.js

@@ -3,6 +3,7 @@ import { preparseMdxTree } from '@mintlify/prebuild';
 import fse from 'fs-extra';
 import { join } from 'path';
 import { CMD_EXEC_PATH, NEXT_PUBLIC_PATH } from '../../constants.js';
+import { packageImportArgs } from '../packages/state.js';
 import { getCurrentVariables, handleParseError } from './utils.js';
 const getImportSourcePath = async (filename) => {
     const generatedPath = join(NEXT_PUBLIC_PATH, filename);
@@ -70,6 +71,7 @@ const resolveSnippetImports = async (snippetsByFilename) => {
             ? await baseResolveAllImports({
                 snippets: resolvedSnippets,
                 fileWithImports: snippet,
+                ...packageImportArgs(),
             })
             : snippet.tree;
         resolvedSnippets.push({ filename: snippet.filename, tree });
@@ -94,5 +96,6 @@ export const resolveImportsFromImportClosure = async (fileWithImports) => {
     return await baseResolveAllImports({
         snippets,
         fileWithImports,
+        ...packageImportArgs(),
     });
 };