New website pages

danez · danez · commit 3906f91311f0 · 2023-03-21T23:29:30.000+01:00
diff --git a/packages/website/.eslintrc.cjs b/packages/website/.eslintrc.cjs
@@ -2,6 +2,7 @@
 
 module.exports = {
   extends: ['../../.eslintrc.cjs', 'plugin:@next/next/recommended'],
+  root: true,
   settings: {
     next: {
       rootDir: __dirname,
diff --git a/packages/website/pages/docs/reference/_meta.json b/packages/website/pages/docs/reference/_meta.json
@@ -2,5 +2,6 @@
   "config": "Config",
   "nodejs": "API",
   "documentation": "Documentation",
-  "filestate": "FileState"
+  "file-state": "FileState",
+  "handlers": "Handlers"
 }
diff --git a/packages/website/pages/docs/reference/documentation.mdx b/packages/website/pages/docs/reference/documentation.mdx
diff --git a/packages/website/pages/docs/reference/documentation/_meta.json b/packages/website/pages/docs/reference/documentation/_meta.json
@@ -0,0 +1,6 @@
+{
+  "basic": "Basic",
+  "prop-types": "PropTypes",
+  "typescript": "TypeScript",
+  "flow": "Flow"
+}
diff --git a/packages/website/pages/docs/reference/documentation/basic.mdx b/packages/website/pages/docs/reference/documentation/basic.mdx
@@ -0,0 +1,56 @@
+import { Callout } from 'nextra-theme-docs';
+
+# Basic
+
+This describes the return value of react-docgen either from the `parse()` method
+or from the CLI output.
+
+For the current TypeScript types you can look at
+[github](https://github.com/reactjs/react-docgen/blob/main/packages/react-docgen/src/Documentation.ts)
+
+## Documentation
+
+```ts
+interface Documentation {
+  childContext?: Record<string, PropDescriptor>;
+  composes?: string[];
+  context?: Record<string, PropDescriptor>;
+  description?: string;
+  displayName?: string;
+  methods?: MethodDescriptor[];
+  props?: Record<string, PropDescriptor>;
+}
+```
+
+### childContext
+
+### composes
+
+**Type**: `string[] | undefined`
+
+If the props of the React component are composed of props which react-docgen was
+unable to resolve, the name of types will be listed here.
+
+<Callout type="warning" emoji="🚧">
+  Create examples
+</Callout>
+
+### context
+
+### description
+
+**Type**: `string | undefined`
+
+If the [`componentDocblockHandler`](../handlers/component-docblock-handler) is
+active this property will be set to the description of the React component.
+
+### displayName
+
+**Type**: `string | undefined`
+
+If the [`displayNameHandler`](../handlers/display-name-handler) is active this
+property will be set to the name of the React component.
+
+### methods
+
+### props
diff --git a/packages/website/pages/docs/reference/documentation/flow.mdx b/packages/website/pages/docs/reference/documentation/flow.mdx
@@ -0,0 +1 @@
+# Flow
diff --git a/packages/website/pages/docs/reference/documentation/prop-types.mdx b/packages/website/pages/docs/reference/documentation/prop-types.mdx
@@ -0,0 +1 @@
+# PropTypes
diff --git a/packages/website/pages/docs/reference/documentation/typescript.mdx b/packages/website/pages/docs/reference/documentation/typescript.mdx
@@ -0,0 +1 @@
+# TypeScript
diff --git a/packages/website/pages/docs/reference/file-state.mdx b/packages/website/pages/docs/reference/file-state.mdx
diff --git a/packages/website/pages/docs/reference/handlers/_meta.json b/packages/website/pages/docs/reference/handlers/_meta.json
@@ -0,0 +1,10 @@
+{
+  "code-type-handler": "codeTypeHandler",
+  "component-docblock-handler": "componentDocblockHandler",
+  "component-methods-handler": "componentMethodsHandler",
+  "default-props-handler": "defaultPropsHandler",
+  "display-name-handler": "displayNameHandler",
+  "prop-docblock-handler": "propDocblockHandler",
+  "proptype-composition-handler": "propTypeCompositionHandler",
+  "proptype-handler": "propTypeHandler"
+}
diff --git a/packages/website/pages/docs/reference/handlers/code-type-handler.mdx b/packages/website/pages/docs/reference/handlers/code-type-handler.mdx
@@ -0,0 +1,2 @@
+# codeTypeHandler
+
diff --git a/packages/website/pages/docs/reference/handlers/component-docblock-handler.mdx b/packages/website/pages/docs/reference/handlers/component-docblock-handler.mdx
@@ -0,0 +1,24 @@
+# componentDocblockHandler
+
+Reads the react components leading block comment and adds its content as
+description to the documentation.
+
+## Example
+
+The following component will result in the following documentation
+
+```ts {1-3} filename="component.tsx"
+/**
+ * This is my component and this is its description.
+ */
+export default () => <div />;
+```
+
+```json {3} filename="Result"
+[
+  {
+    "description": "This is my component and this is its description.",
+    "methods": []
+  }
+]
+```
diff --git a/packages/website/pages/docs/reference/handlers/component-methods-handler.mdx b/packages/website/pages/docs/reference/handlers/component-methods-handler.mdx
@@ -0,0 +1,2 @@
+# componentMethodsHandler
+
diff --git a/packages/website/pages/docs/reference/handlers/default-props-handler.mdx b/packages/website/pages/docs/reference/handlers/default-props-handler.mdx
@@ -0,0 +1,64 @@
+# defaultPropsHandler
+
+Finds the default props from the react component.
+
+## Example
+
+The following components will all result in the following documentation
+
+```ts {2-4} filename="component.tsx"
+export default class MyComponent extends React.Component {
+  static defaultProps = {
+    a: '1',
+  };
+  render() {
+    return <div />;
+  }
+}
+```
+
+```ts {7-9} filename="component.tsx"
+class MyComponent extends React.Component {
+  render() {
+    return <div />;
+  }
+}
+
+MyComponent.defaultProps = {
+  a: '1',
+};
+
+export default MyComponent;
+```
+
+```ts {3-5} filename="component.tsx"
+const MyComponent = () => <div />;
+
+MyComponent.defaultProps = {
+  a: '1',
+};
+
+export default MyComponent;
+```
+
+```ts /{ a = '1' }/ filename="component.tsx"
+export default ({ a = '1' }) => <div />;
+```
+
+```json {7-11} filename="Result"
+[
+  {
+    "description": "",
+    "methods": [],
+    "props": {
+      "a": {
+        "defaultValue": {
+          "value": "'1'",
+          "computed": false
+        },
+        "required": false
+      }
+    }
+  }
+]
+```
diff --git a/packages/website/pages/docs/reference/handlers/display-name-handler.mdx b/packages/website/pages/docs/reference/handlers/display-name-handler.mdx
@@ -0,0 +1 @@
+# displayNameHandler
diff --git a/packages/website/pages/docs/reference/handlers/prop-docblock-handler.mdx b/packages/website/pages/docs/reference/handlers/prop-docblock-handler.mdx
@@ -0,0 +1 @@
+# propDocblockHandler
diff --git a/packages/website/pages/docs/reference/handlers/proptype-composition-handler.mdx b/packages/website/pages/docs/reference/handlers/proptype-composition-handler.mdx
@@ -0,0 +1 @@
+# propTypeCompositionHandler
diff --git a/packages/website/pages/docs/reference/handlers/proptype-handler.mdx b/packages/website/pages/docs/reference/handlers/proptype-handler.mdx
@@ -0,0 +1 @@
+# propTypeHandler

Original file line number	Diff line number	Diff line change
`@@ -2,5 +2,6 @@`
`2`	`2`	`"config": "Config",`
`3`	`3`	`"nodejs": "API",`
`4`	`4`	`"documentation": "Documentation",`
`5`		`- "filestate": "FileState"`
	`5`	`+ "file-state": "FileState",`
	`6`	`+ "handlers": "Handlers"`
`6`	`7`	`}`