diff --git a/.changeset/gentle-plants-smell.md b/.changeset/gentle-plants-smell.md new file mode 100644 index 00000000000..9ad44a9d7b9 --- /dev/null +++ b/.changeset/gentle-plants-smell.md @@ -0,0 +1,5 @@ +--- +'react-docgen': major +--- + +Rename `propDocBlockHandler` to `propDocblockHandler` for consistency diff --git a/.changeset/plenty-cooks-grow.md b/.changeset/plenty-cooks-grow.md new file mode 100644 index 00000000000..811ec4f539b --- /dev/null +++ b/.changeset/plenty-cooks-grow.md @@ -0,0 +1,5 @@ +--- +'react-docgen': patch +--- + +Fix using react-docgen in browsers diff --git a/.changeset/polite-pandas-push.md b/.changeset/polite-pandas-push.md new file mode 100644 index 00000000000..e25fd88b328 --- /dev/null +++ b/.changeset/polite-pandas-push.md @@ -0,0 +1,5 @@ +--- +'react-docgen': patch +--- + +Add `displayName` and `description` to Documentation type diff --git a/packages/react-docgen/package.json b/packages/react-docgen/package.json index f72ca48b431..f21deb192b9 100644 --- a/packages/react-docgen/package.json +++ b/packages/react-docgen/package.json @@ -6,7 +6,9 @@ "type": "module", "browser": { "./dist/importer/fsImporter.js": "./dist/importer/ignoreImporter.js", - "./src/importer/fsImporter.ts": "./src/importer/ignoreImporter.ts" + "./src/importer/fsImporter.ts": "./src/importer/ignoreImporter.ts", + "./dist/importer/makeFsImporter.js": "./dist/importer/makeIgnoreImporter.js", + "./src/importer/makeFsImporter.ts": "./src/importer/makeIgnoreImporter.ts" }, "files": [ "dist" diff --git a/packages/react-docgen/src/Documentation.ts b/packages/react-docgen/src/Documentation.ts index 25886663dd0..47bd4d61b7e 100644 --- a/packages/react-docgen/src/Documentation.ts +++ b/packages/react-docgen/src/Documentation.ts @@ -1,15 +1,17 @@ export interface DocumentationObject { - props?: Record; - context?: Record; childContext?: Record; composes?: string[]; + context?: Record; + description?: string; + displayName?: string; methods?: MethodDescriptor[]; + props?: Record; } export interface MethodParameter { name: string; - type?: TypeDescriptor | null; optional: boolean; + type?: TypeDescriptor | null; } export interface MethodReturn { @@ -162,6 +164,7 @@ export default class Documentation { this.#data.set(key, value); } + get(key: string): T | null; get(key: string): unknown { return this.#data.get(key); } diff --git a/packages/react-docgen/src/config.ts b/packages/react-docgen/src/config.ts index 0efa0f52feb..19eb6263210 100644 --- a/packages/react-docgen/src/config.ts +++ b/packages/react-docgen/src/config.ts @@ -9,7 +9,7 @@ import { contextTypeHandler, defaultPropsHandler, displayNameHandler, - propDocBlockHandler, + propDocblockHandler, propTypeCompositionHandler, propTypeHandler, } from './handlers/index.js'; @@ -52,7 +52,7 @@ export const defaultHandlers: Handler[] = [ contextTypeHandler, childContextTypeHandler, propTypeCompositionHandler, - propDocBlockHandler, + propDocblockHandler, codeTypeHandler, defaultPropsHandler, componentDocblockHandler, diff --git a/packages/react-docgen/src/handlers/__tests__/propDocblockHandler-test.ts b/packages/react-docgen/src/handlers/__tests__/propDocblockHandler-test.ts index fd6bb5e1c55..24ca45eb58e 100644 --- a/packages/react-docgen/src/handlers/__tests__/propDocblockHandler-test.ts +++ b/packages/react-docgen/src/handlers/__tests__/propDocblockHandler-test.ts @@ -5,12 +5,12 @@ import Documentation from '../../Documentation'; import type { Importer } from '../../importer'; import type { ComponentNode } from '../../resolver'; import type DocumentationMock from '../../__mocks__/Documentation'; -import propDocBlockHandler from '../propDocBlockHandler.js'; +import propDocblockHandler from '../propDocblockHandler.js'; import { beforeEach, describe, expect, test, vi } from 'vitest'; vi.mock('../../Documentation.js'); -describe('propDocBlockHandler', () => { +describe('propDocblockHandler', () => { let documentation: Documentation & DocumentationMock; beforeEach(() => { @@ -49,7 +49,7 @@ describe('propDocBlockHandler', () => { ), ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'Foo comment', @@ -75,7 +75,7 @@ describe('propDocBlockHandler', () => { ), ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: @@ -102,7 +102,7 @@ describe('propDocBlockHandler', () => { ), ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'Foo comment', @@ -126,7 +126,7 @@ describe('propDocBlockHandler', () => { ), ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'Foo comment', @@ -150,7 +150,7 @@ describe('propDocBlockHandler', () => { ), ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'Foo comment', @@ -169,7 +169,7 @@ describe('propDocBlockHandler', () => { }; `); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'Foo comment', @@ -186,7 +186,7 @@ describe('propDocBlockHandler', () => { mockImporter, ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'A comment on imported props', @@ -210,7 +210,7 @@ describe('propDocBlockHandler', () => { mockImporter, ); - propDocBlockHandler(documentation, definition); + propDocblockHandler(documentation, definition); expect(documentation.descriptors).toEqual({ foo: { description: 'A comment on imported props', @@ -263,7 +263,7 @@ describe('propDocBlockHandler', () => { const definition = parse.expression('{fooBar: 42}'); expect(() => - propDocBlockHandler(documentation, definition), + propDocblockHandler(documentation, definition), ).not.toThrow(); }); @@ -271,7 +271,7 @@ describe('propDocBlockHandler', () => { const definition = parse.statement('class Foo {}'); expect(() => - propDocBlockHandler(documentation, definition), + propDocblockHandler(documentation, definition), ).not.toThrow(); }); }); diff --git a/packages/react-docgen/src/handlers/componentMethodsJsDocHandler.ts b/packages/react-docgen/src/handlers/componentMethodsJsDocHandler.ts index f8676a9a4b5..2791d8a78fd 100644 --- a/packages/react-docgen/src/handlers/componentMethodsJsDocHandler.ts +++ b/packages/react-docgen/src/handlers/componentMethodsJsDocHandler.ts @@ -29,7 +29,7 @@ function merge(obj1: T, obj2: U): (T & U) | null { const componentMethodsJsDocHandler: Handler = function ( documentation: Documentation, ): void { - let methods = documentation.get('methods') as MethodDescriptor[] | null; + let methods = documentation.get('methods'); if (!methods) { return; diff --git a/packages/react-docgen/src/handlers/index.ts b/packages/react-docgen/src/handlers/index.ts index 80ab74cc0a2..90d1f75dabc 100644 --- a/packages/react-docgen/src/handlers/index.ts +++ b/packages/react-docgen/src/handlers/index.ts @@ -8,7 +8,7 @@ export { default as componentMethodsJsDocHandler } from './componentMethodsJsDoc export { default as defaultPropsHandler } from './defaultPropsHandler.js'; export { default as displayNameHandler } from './displayNameHandler.js'; export { default as codeTypeHandler } from './codeTypeHandler.js'; -export { default as propDocBlockHandler } from './propDocBlockHandler.js'; +export { default as propDocblockHandler } from './propDocblockHandler.js'; export { default as propTypeCompositionHandler } from './propTypeCompositionHandler.js'; export { propTypeHandler, diff --git a/packages/react-docgen/src/handlers/propDocBlockHandler.ts b/packages/react-docgen/src/handlers/propDocblockHandler.ts similarity index 94% rename from packages/react-docgen/src/handlers/propDocBlockHandler.ts rename to packages/react-docgen/src/handlers/propDocblockHandler.ts index c80eea6c711..6a859a15803 100644 --- a/packages/react-docgen/src/handlers/propDocBlockHandler.ts +++ b/packages/react-docgen/src/handlers/propDocblockHandler.ts @@ -29,7 +29,7 @@ function resolveDocumentation( }); } -const propDocBlockHandler: Handler = function ( +const propDocblockHandler: Handler = function ( documentation: Documentation, componentDefinition: NodePath, ): void { @@ -49,4 +49,4 @@ const propDocBlockHandler: Handler = function ( resolveDocumentation(documentation, propTypesPath); }; -export default propDocBlockHandler; +export default propDocblockHandler; diff --git a/packages/react-docgen/src/importer/ignoreImporter.ts b/packages/react-docgen/src/importer/ignoreImporter.ts index c8adfee9bbb..7220ab87c37 100644 --- a/packages/react-docgen/src/importer/ignoreImporter.ts +++ b/packages/react-docgen/src/importer/ignoreImporter.ts @@ -1,7 +1,5 @@ -import type { Importer } from './index.js'; +import makeIgnoreImporter from './makeIgnoreImporter.js'; -const ignoreImports: Importer = function (): null { - return null; -}; +const ignoreImporter = makeIgnoreImporter(); -export default ignoreImports; +export default ignoreImporter; diff --git a/packages/react-docgen/src/importer/makeIgnoreImporter.ts b/packages/react-docgen/src/importer/makeIgnoreImporter.ts new file mode 100644 index 00000000000..8981ec0ff67 --- /dev/null +++ b/packages/react-docgen/src/importer/makeIgnoreImporter.ts @@ -0,0 +1,5 @@ +import type { Importer } from './index.js'; + +export default function makeIgnoreImporter(): Importer { + return () => null; +} diff --git a/packages/website/pages/_app.mdx b/packages/website/pages/_app.mdx new file mode 100644 index 00000000000..2e1b362c345 --- /dev/null +++ b/packages/website/pages/_app.mdx @@ -0,0 +1,3 @@ +export default function App({ Component, pageProps }) { + return +} \ No newline at end of file diff --git a/packages/website/pages/docs/reference/cli.mdx b/packages/website/pages/docs/reference/cli.mdx index 9fac257a423..972d975a9a8 100644 --- a/packages/website/pages/docs/reference/cli.mdx +++ b/packages/website/pages/docs/reference/cli.mdx @@ -1,15 +1,3 @@ -import Image from 'next/image'; - -export const whoa = ( - whoa -); - # Command Line Interface (CLI) Reference This is the complete reference of all available options for the CLI. A basic @@ -49,7 +37,7 @@ independent of this option. ### `--help` -Displays the help for the command with the current default values. <>{whoa} +Displays the help for the command with the current default values. ### `-i, --ignore ` diff --git a/packages/website/public/mind-blown-shocked.gif b/packages/website/public/mind-blown-shocked.gif deleted file mode 100644 index 4188930224c..00000000000 Binary files a/packages/website/public/mind-blown-shocked.gif and /dev/null differ