diff --git a/types/wordpress__element/index.d.ts b/types/wordpress__element/index.d.ts new file mode 100644 index 0000000000..417c40b107 --- /dev/null +++ b/types/wordpress__element/index.d.ts @@ -0,0 +1,59 @@ +// Type definitions for @wordpress/element 2.4 +// Project: https://github.com/WordPress/gutenberg/tree/master/packages/element/README.md +// Definitions by: Derek Sifford +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 3.4 + +import * as R from "react"; +import * as RD from "react-dom"; + +declare global { + namespace React { + // + // ReactDOM re-exports + // + const createPortal: typeof RD.createPortal; + const findDOMNode: typeof RD.findDOMNode; + const render: typeof RD.render; + const unmountComponentAtNode: typeof RD.unmountComponentAtNode; + + /** + * Component used as equivalent of Fragment with unescaped HTML, in cases where + * it is desirable to render dangerous HTML without needing a wrapper element. + * To preserve additional props, a `div` wrapper _will_ be created if any props + * aside from `children` are passed. + * + * @param props.children - HTML to render. + * + * @return Dangerously-rendering element. + */ + function RawHTML( + props: { children: string } & HTMLProps + ): JSX.Element; + + /** + * Checks if the provided WP element is empty. + * + * @param element - WP element to check. + * @return True when an element is considered empty. + */ + function isEmptyElement(element: ReactNode): boolean; + + /** + * Serializes a React element to string. + * + * @param element - Element to serialize. + * @param context - Context object. + * @param legacyContext - Legacy context object. + * + * @return Serialized element. + */ + function renderToString( + element: ReactNode, + context?: any, + legacyContext?: any + ): string; + } +} + +export = React; diff --git a/types/wordpress__element/package.json b/types/wordpress__element/package.json new file mode 100644 index 0000000000..4d9ec4a338 --- /dev/null +++ b/types/wordpress__element/package.json @@ -0,0 +1,6 @@ +{ + "private": true, + "dependencies": { + "csstype": "^2.2.0" + } +} diff --git a/types/wordpress__element/tsconfig.json b/types/wordpress__element/tsconfig.json new file mode 100644 index 0000000000..72e65886e3 --- /dev/null +++ b/types/wordpress__element/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": ["es6", "dom"], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": ["../"], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true, + "paths": { + "@wordpress/element": ["wordpress__element"] + } + }, + "files": ["index.d.ts", "wordpress__element-tests.ts"] +} diff --git a/types/wordpress__element/tslint.json b/types/wordpress__element/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/wordpress__element/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" } diff --git a/types/wordpress__element/wordpress__element-tests.ts b/types/wordpress__element/wordpress__element-tests.ts new file mode 100644 index 0000000000..43a9b41ec0 --- /dev/null +++ b/types/wordpress__element/wordpress__element-tests.ts @@ -0,0 +1,23 @@ +import * as WPElement from "@wordpress/element"; + +const testElement = WPElement.createElement( + "div", + { className: "foobar" }, + "hello world" +); + +WPElement.createRef(); + +WPElement.createPortal(testElement, document.createElement("div")); + +WPElement.findDOMNode(null); + +WPElement.render(testElement, document.createElement("div")); + +WPElement.unmountComponentAtNode(document.createElement("div")); + +WPElement.RawHTML({ children: "

Hello world

" }); + +WPElement.isEmptyElement("hello world"); + +WPElement.renderToString(WPElement.createElement("div", {}, "hello world"));