;
},
Gotcha,
+ Deprecated,
Wip,
HomepageHero,
Illustration,
diff --git a/beta/src/content/apis/react/createFactory.md b/beta/src/content/apis/react/createFactory.md
index 834d6b3b..156e055f 100644
--- a/beta/src/content/apis/react/createFactory.md
+++ b/beta/src/content/apis/react/createFactory.md
@@ -2,19 +2,143 @@
title: createFactory
---
-
+
-This section is incomplete, please see the old docs for [createFactory.](https://reactjs.org/docs/react-api.html#createfactory)
-
-
+This API will be removed in a future major version of React. Use [JSX](/learn/writing-markup-with-jsx) or [`createElement`](/api/react/createElement) instead.
+
+`createFactory` lets you create a function that produces React elements of a given type.
+
```js
-React.createFactory(type)
+const factory = createFactory(type)
```
+
+---
+
+## Usage {/*usage*/}
+
+### Creating React elements {/*creating-react-elements*/}
+
+You shouldn't use `createFactory` in new code. In the existing code, it's typically used as an alternative to [JSX:](/learn/writing-markup-with-jsx)
+
+
+
+```js App.js
+import { createFactory } from 'react';
+
+const button = createFactory('button');
+
+export default function App() {
+ return button({
+ onClick: () => {
+ alert('Clicked!')
+ }
+ }, 'Click me');
+}
+```
+
+
+
+Since `createFactory` has been deprecated, you need to remove it from your project's code.
+
+For example, you can convert it to use [`createElement`](/api/react/createElement) instead of `createFactory` like this:
+
+
+
+```js App.js
+import { createElement } from 'react';
+
+export default function App() {
+ return createElement('button', {
+ onClick: () => {
+ alert('Clicked!')
+ }
+ }, 'Click me');
+};
+```
+
+
+
+Alternatively, you can convert it to use [JSX:](/learn/writing-markup-with-jsx)
+
+
+
+```js App.js
+export default function App() {
+ return (
+
+ );
+};
+```
+
+
+
+Every pattern that uses `createFactory` can be converted to either of the two styles above.
+
+
+
+The full implementation of `createFactory` looks like this:
+
+```js
+import { createElement } from 'react';
+
+function createFactory(type) {
+ return createElement.bind(null, type);
+}
+```
+
+If your project uses `createFactory` a lot, you may copy this helper into your project or publish it on npm.
+
+
+
+---
+
+## Reference {/*reference*/}
+
+### `createFactory(type)` {/*createfactory*/}
+
+
+
+
+This API will be removed in a future major version of React. Use [JSX](/learn/writing-markup-with-jsx) or [`createElement`](/api/react/createElement) instead.
+
+
+
+Call `createFactory(type)` to create a factory function which produces React elements of a given `type`.
+
+```js
+import { createFactory } from 'react';
+
+const button = createFactory('button');
+```
+
+Then you can use it to create React elements without JSX:
+
+```js
+export default function App() {
+ return button({
+ onClick: () => {
+ alert('Clicked!')
+ }
+ }, 'Click me');
+}
+```
+
+#### Parameters {/*parameters*/}
+
+* `type`: The `type` argument must be a valid React component type. For example, it could be a tag name string (such as `'div'` or `'span'`), or a React component (a function, a class, or a special component like [`Fragment`](/apis/react/Fragment)).
+
+#### Returns {/*returns*/}
+
+Returns a factory function. That factory function receives a `props` object as the first argument, followed by a list of `...children` arguments, and returns a React element with the given `type`, `props` and `children`.
diff --git a/beta/src/sidebarReference.json b/beta/src/sidebarReference.json
index 40132eeb..1ff72d4f 100644
--- a/beta/src/sidebarReference.json
+++ b/beta/src/sidebarReference.json
@@ -37,8 +37,7 @@
},
{
"title": "createFactory",
- "path": "/apis/react/createFactory",
- "wip": true
+ "path": "/apis/react/createFactory"
},
{
"title": "createRef",