@jetbrains/ring-ui 5.0.0-beta.18 → 5.0.0-beta.19

package/CHANGELOG.md

@@ -39,6 +39,7 @@
   You can also pass `Theme.AUTO` to use the user-defined system theme.
   The only exceptions are the components that provide dark context by default: Alert, Header, Message. Those still accept a `theme` prop.
 - `--ring-dark-*` CSS custom properties are removed, `--ring-dark-text-color` is renamed to `--ring-white-text-color`
+- `--ring-message-background-color` is removed in favor of `--ring-popup-background-color`
 - The codebase has migrated to TypeScript
 - `react-markdown` has been updated to v7, which affects the props of `Markdown` component. The most notable change is replacing `source` with `children`:
   ```js
@@ -52,6 +53,18 @@
 - Removed `core-js@2` support
 - Removed `webpack@4` support
 
+## [4.2.0]
+
+### React 18 support
+
+To enable the new root API, add the following code before any rendering:
+```js
+import * as client from 'react-dom/client'
+import {setClient} from '@jetbrains/ring-ui/components/global/react-render-adapter'
+
+setClient(client)
+```
+
 ## [4.1.0]
 
 ### Pre-built version

package/components/alert/alert.css

@@ -24,7 +24,7 @@
   pointer-events: auto;
 
   border-radius: var(--ring-border-radius);
-  background-color: var(--ring-message-background-color);
+  background-color: var(--ring-popup-background-color);
   box-shadow: var(--ring-popup-shadow);
 
   font-size: var(--ring-font-size);

package/components/alert-service/alert-service.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { render } from '../global/react-render-adapter';
 import getUID from '../global/get-uid';
 import Alert, { ANIMATION_TIME, Container as AlertContainer } from '../alert/alert';
 /**

package/components/analytics/analytics__ga-plugin.d.ts

@@ -10,7 +10,7 @@ declare global {
  * @constructor
  */
 export default class AnalyticsGAPlugin implements AnalyticsPlugin {
-    constructor(gaId?: string | undefined, isDevelopment?: boolean | undefined, domain?: string);
+    constructor(gaId?: string | undefined, isDevelopment?: boolean | undefined, domain?: string, cookielessUserIdentifier?: string | undefined);
     trackEvent(category: string, action: string): void;
     trackPageView(path: string): void;
     get serializeAdditionalInfo(): boolean;

package/components/analytics/analytics__ga-plugin.js

@@ -4,7 +4,7 @@
  * @constructor
  */
 export default class AnalyticsGAPlugin {
-    constructor(gaId, isDevelopment, domain) {
+    constructor(gaId, isDevelopment, domain, cookielessUserIdentifier) {
         if (!gaId && !isDevelopment) {
             return;
         }
@@ -25,8 +25,16 @@ export default class AnalyticsGAPlugin {
          */
         const key = gaId || 'UA-57284711-1';
         /* global ga */
-        const gaCookieParams = domain ? { cookieDomain: domain } : {};
-        ga('create', key, (!gaId ? { cookieDomain: 'none' } : gaCookieParams));
+        if (cookielessUserIdentifier) {
+            ga('create', key, {
+                storage: 'none',
+                clientId: cookielessUserIdentifier
+            });
+        }
+        else {
+            const gaCookieParams = domain ? { cookieDomain: domain } : {};
+            ga('create', key, (!gaId ? { cookieDomain: 'none' } : gaCookieParams));
+        }
         ga('set', 'anonymizeIp', true);
         ga('set', 'allowAdFeatures', false);
     }

package/components/auth/auth__core.js

@@ -727,9 +727,13 @@ export default class Auth {
         return await (stateId && this._storage?.getState(stateId)) || {};
     }
     _checkBackendsAreUp() {
+        const abortCtrl = new AbortController();
         const { backendCheckTimeout } = this.config;
         return Promise.all([
-            promiseWithTimeout(this.http.fetch('settings/public?fields=id'), backendCheckTimeout, { error: new Error('The authorization server is taking too long to respond. Please try again later.') }),
+            promiseWithTimeout(this.http.fetch('settings/public?fields=id', { signal: abortCtrl.signal }), backendCheckTimeout, {
+                error: new Error('The authorization server is taking too long to respond. Please try again later.'),
+                onTimeout: () => abortCtrl.abort()
+            }),
             this.config.checkBackendIsUp()
         ]).catch(err => {
             if (err instanceof TypeError) {

package/components/auth-dialog-service/auth-dialog-service.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { render } from '../global/react-render-adapter';
 import AuthDialog from '../auth-dialog/auth-dialog';
 /**
  * @name Auth Dialog Service

package/components/button/button.d.ts

@@ -3,7 +3,7 @@ import React, { PureComponent, ButtonHTMLAttributes } from 'react';
 import PropTypes from 'prop-types';
 import { IconType, Size } from '../icon/icon';
 import { ClickableLinkProps } from '../link/clickableLink';
-import { ControlsHeight } from '../global/controls-height';
+import { ControlsHeight, ControlsHeightContext } from '../global/controls-height';
 export interface ButtonBaseProps {
     height?: ControlsHeight | undefined;
     active?: boolean | null | undefined;
@@ -58,6 +58,7 @@ export declare class Button extends PureComponent<ButtonProps> {
     };
     static IconSize: typeof Size;
     static contextType: React.Context<ControlsHeight>;
+    context: React.ContextType<typeof ControlsHeightContext>;
     buttonRef: React.RefObject<HTMLButtonElement>;
     render(): JSX.Element;
 }

package/components/confirm-service/confirm-service.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { render } from '../global/react-render-adapter';
 import Confirm from '../confirm/confirm';
 /**
  * @name Confirm Service

package/components/data-list/data-list.d.ts

@@ -31,12 +31,10 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             onMouseMove: () => void;
             onKeyDown: (e: KeyboardEvent) => void;
             render(): JSX.Element;
-            context: any;
+            context: unknown;
             setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
-            readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>> & Readonly<{
-                children?: React.ReactNode;
-            }>;
+            readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>;
             refs: {
                 [key: string]: React.ReactInstance;
             };
@@ -60,12 +58,10 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             onMouseMove: () => void;
             onKeyDown: (e: KeyboardEvent) => void;
             render(): JSX.Element;
-            context: any;
+            context: unknown;
             setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
-            readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>> & Readonly<{
-                children?: React.ReactNode;
-            }>;
+            readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>;
             refs: {
                 [key: string]: React.ReactInstance;
             };

package/components/date-picker/date-picker.css

@@ -1,4 +1,5 @@
 @import "../global/variables.css";
+@import "../global/global.css";
 
 @value unit from "../global/global.css";
 @value cellSize: calc(unit * 3);

package/components/date-picker/date-popup.js

@@ -76,7 +76,6 @@ export default class DatePopup extends Component {
             if (this.state.text && prevState.active) {
                 this.confirm(prevState.active);
             }
-            // eslint-disable-next-line react/no-did-update-set-state
             this.setState({ text: null });
         }
     }

package/components/dialog/dialog.d.ts

@@ -24,7 +24,7 @@ export default class Dialog extends PureComponent<DialogProps> {
         label: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;
         contentClassName: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        children: PropTypes.Requireable<string | number | boolean | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
         show: PropTypes.Validator<boolean>;
         showCloseButton: PropTypes.Requireable<boolean>;
         closeButtonInside: PropTypes.Requireable<boolean>;

package/components/dropdown/dropdown.d.ts

@@ -6,7 +6,7 @@ export interface AnchorProps {
     active: boolean;
     pinned: boolean;
 }
-export interface DropdownProps extends HTMLAttributes<HTMLElement> {
+export interface DropdownProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
     anchor: ReactElement | readonly ReactElement[] | string | ((props: AnchorProps) => ReactNode);
     children: ReactElement<PopupAttrs> | ((props: Omit<PopupAttrs, 'children'>) => ReactNode);
     initShown: boolean;
@@ -32,7 +32,7 @@ export default class Dropdown extends Component<DropdownProps, DropdownState> {
          * Can be string, React element, or a function accepting an object with {active, pinned} properties and returning a React element
          * React element should render some interactive HTML element like `button` or `a`
          */
-        anchor: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        anchor: PropTypes.Validator<string | number | boolean | PropTypes.ReactElementLike | PropTypes.ReactNodeArray | ((...args: any[]) => any)>;
         children: PropTypes.Validator<PropTypes.ReactElementLike | ((...args: any[]) => any)>;
         initShown: PropTypes.Requireable<boolean>;
         className: PropTypes.Requireable<string>;

package/components/global/angular-component-factory.js

@@ -1,8 +1,8 @@
 import angular from 'angular';
 
 import React from 'react';
-import {render, unmountComponentAtNode} from 'react-dom';
 
+import {render, unmountComponentAtNode} from './react-render-adapter';
 import RingAngularComponent from './ring-angular-component';
 
 import DomRenderer from './react-dom-renderer';

package/components/global/promise-with-timeout.d.ts

@@ -1,4 +1,5 @@
 export interface PromiseWithTimeoutConfig {
     error?: Error | null | undefined;
+    onTimeout?: () => void | undefined;
 }
-export default function promiseWithTimeout<T>(promise: Promise<T>, timeout: number, { error }: PromiseWithTimeoutConfig): Promise<unknown>;
+export default function promiseWithTimeout<T>(promise: Promise<T>, timeout: number, { error, onTimeout }: PromiseWithTimeoutConfig): Promise<unknown>;

package/components/global/promise-with-timeout.js

@@ -1,8 +1,11 @@
 // Useful for using fetch with timeout
 // https://github.com/github/fetch/issues/175#issuecomment-284787564
-export default function promiseWithTimeout(promise, timeout, { error }) {
+export default function promiseWithTimeout(promise, timeout, { error, onTimeout = () => { } }) {
     return new Promise((resolve, reject) => {
-        setTimeout(() => reject(error || new Error('Timeout')), timeout);
+        setTimeout(() => {
+            onTimeout();
+            reject(error || new Error('Timeout'));
+        }, timeout);
         promise.then(resolve, reject);
     });
 }

package/components/global/react-render-adapter.d.ts

@@ -0,0 +1,29 @@
+import type { ReactChild, ReactElement, ReactNode } from 'react';
+import { unmountComponentAtNode as legacyUnmountComponentAtNode } from 'react-dom';
+export declare let render: (element: ReactElement, container: Element | DocumentFragment) => void;
+export declare let unmountComponentAtNode: typeof legacyUnmountComponentAtNode;
+export declare let hydrate: (element: ReactElement, container: Element | Document) => void;
+interface Root {
+    render(children: ReactChild | Iterable<ReactNode>): void;
+    unmount(): void;
+}
+interface RootOptions {
+    /**
+     * Prefix for `useId`.
+     */
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown) => void;
+}
+interface HydrationOptions {
+    /**
+     * Prefix for `useId`.
+     */
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown) => void;
+}
+interface Client {
+    createRoot(container: Element | DocumentFragment, options?: RootOptions): Root;
+    hydrateRoot(container: Element | Document, initialChildren: ReactChild | Iterable<ReactNode>, options?: HydrationOptions): Root;
+}
+export declare function setClient({ createRoot, hydrateRoot }: Client): void;
+export {};

package/components/global/react-render-adapter.js

@@ -0,0 +1,36 @@
+// Allows overriding ReactDOM.render when using React 18:
+// import * as client from 'react-dom/client'
+// import {setClient} from '@jetbrains/ring-ui/components/global/react-render-adapter'
+//
+// setClient(client)
+import {
+  render as legacyRender,
+  unmountComponentAtNode as legacyUnmountComponentAtNode,
+  hydrate as legacyHydrate
+} from 'react-dom';
+
+/* eslint-disable import/no-mutable-exports */
+export let render = legacyRender;
+export let unmountComponentAtNode = legacyUnmountComponentAtNode;
+export let hydrate = legacyHydrate;
+/* eslint-enable */
+
+export function setClient({createRoot, hydrateRoot}) {
+  const roots = new WeakMap();
+
+  render = (element, container) => {
+    let root = roots.get(container);
+    if (root == null) {
+      root = createRoot(container);
+      roots.set(container, root);
+    }
+    root.render(element);
+  };
+
+  unmountComponentAtNode = container => roots.get(container)?.unmount();
+
+  hydrate = (element, container) => {
+    const root = hydrateRoot(container, element);
+    roots.set(container, root);
+  };
+}

package/components/global/rerender-hoc.d.ts

@@ -1,4 +1,4 @@
-import { Component } from 'react';
+import { Component, RefAttributes } from 'react';
 export interface RerenderableComponent<P, S> extends Component<P, S> {
     node?: HTMLElement | null;
 }
@@ -13,18 +13,14 @@ export interface RerenderableComponentClass<P, S> {
  */
 export default function rerenderHOC<P, S>(ComposedComponent: RerenderableComponentClass<P, S>): {
     new (props: P): {
-        _propsCache: Readonly<P> & Readonly<{
-            children?: import("react").ReactNode;
-        }>;
-        rerender(props?: Partial<P>, callback?: (() => void) | undefined): void | Element | Component<P, any, any>;
+        _propsCache: P & RefAttributes<unknown>;
+        rerender(props?: Partial<P>, callback?: (() => void) | undefined): void;
         node?: HTMLElement | null | undefined;
-        context: any;
+        context: unknown;
         setState<K extends keyof S>(state: S | ((prevState: Readonly<S>, props: Readonly<P>) => S | Pick<S, K> | null) | Pick<S, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
         render(): import("react").ReactNode;
-        readonly props: Readonly<P> & Readonly<{
-            children?: import("react").ReactNode;
-        }>;
+        readonly props: Readonly<P>;
         state: Readonly<S>;
         refs: {
             [key: string]: import("react").ReactInstance;

package/components/global/rerender-hoc.js

@@ -1,5 +1,6 @@
 import { createElement } from 'react';
-import { render } from 'react-dom';
+import { render } from './react-render-adapter';
+import composeRefs from './composeRefs';
 /**
  * Wraps a component to add a "rerender" method
  * @param ComposedComponent
@@ -20,7 +21,8 @@ export default function rerenderHOC(ComposedComponent) {
                 }
             }
             this._propsCache = Object.assign({}, this.props, this._propsCache, props);
-            return render(createElement(this.constructor, this._propsCache), container, callback);
+            this._propsCache.ref = composeRefs(this._propsCache.ref, callback);
+            render(createElement(this.constructor, this._propsCache), container);
         }
     };
 }

package/components/global/variables.css

@@ -51,7 +51,6 @@
   --ring-sidebar-background-color: #f7f9fa;
   --ring-selected-background-color: #d4edff;
   --ring-hover-background-color: #ebf6ff;
-  --ring-message-background-color: #111314;
   --ring-navigation-background-color: #fff;
   --ring-tag-background-color: #e6ecf2;
   --ring-tag-hover-background-color: #d3dae0;

package/components/global/variables.d.ts

@@ -41,7 +41,6 @@ export interface RingCSSProperties {
     '--ring-sidebar-background-color'?: Property.BackgroundColor;
     '--ring-selected-background-color'?: Property.BackgroundColor;
     '--ring-hover-background-color'?: Property.BackgroundColor;
-    '--ring-message-background-color'?: Property.BackgroundColor;
     '--ring-navigation-background-color'?: Property.BackgroundColor;
     '--ring-tag-background-color'?: Property.BackgroundColor;
     '--ring-tag-hover-background-color'?: Property.BackgroundColor;

package/components/global/variables_dark.css

@@ -40,7 +40,6 @@
   --ring-sidebar-background-color: #28343d;
   --ring-selected-background-color: #062640;
   --ring-hover-background-color: #0b1a26;
-  --ring-message-background-color: var(--ring-popup-background-color);
   --ring-navigation-background-color: #111314;
   --ring-tag-background-color: #3e4d59;
   --ring-tag-hover-background-color: #333e47;

package/components/header/profile.d.ts

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { Size } from '../avatar/avatar';
 import { ListDataItem } from '../list/consts';
 import { AuthUser } from '../auth/auth';
-import { LinkProps } from '../link/link';
+import { ClickableLinkProps } from '../link/clickableLink';
 export interface ProfileTranslations {
     applyChangedUser?: string | null | undefined;
     login?: string | null | undefined;
@@ -24,7 +24,7 @@ export interface ProfileProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSe
     onLogout?: (() => void) | null | undefined;
     onSwitchUser?: (() => void) | null | undefined;
     profileUrl?: string | undefined;
-    LinkComponent?: ComponentType<LinkProps> | null | undefined;
+    LinkComponent?: ComponentType<ClickableLinkProps> | null | undefined;
     user?: AuthUser | null | undefined | void;
     round?: boolean | null | undefined;
     showLogIn?: boolean | null | undefined;
@@ -68,6 +68,6 @@ export default class Profile extends PureComponent<ProfileProps> {
     };
     static defaultProps: ProfileProps;
     static Size: typeof Size;
-    render(): React.ReactNode;
+    render(): string | number | boolean | JSX.Element | React.ReactFragment | null | undefined;
 }
 export declare type ProfileAttrs = JSX.LibraryManagedAttributes<typeof Profile, ProfileProps>;

package/components/island/adaptive-island-hoc.d.ts

@@ -9,12 +9,10 @@ export default function adaptiveIslandHOC<P>(ComposedComponent: ComponentType<P>
         };
         onContentScroll: ({ scrollTop, scrollHeight, clientHeight }: Element) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<P>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<P> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<P>;
         refs: {
             [key: string]: React.ReactInstance;
         };
@@ -37,12 +35,10 @@ export default function adaptiveIslandHOC<P>(ComposedComponent: ComponentType<P>
         };
         onContentScroll: ({ scrollTop, scrollHeight, clientHeight }: Element) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<P>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<P> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<P>;
         refs: {
             [key: string]: React.ReactInstance;
         };

package/components/island/content.d.ts

@@ -1,4 +1,6 @@
-import { HTMLAttributes } from 'react';
+import React, { Component, HTMLAttributes } from 'react';
+import PropTypes from 'prop-types';
+import createResizeDetector from 'element-resize-detector';
 export interface IslandContentProps extends Omit<HTMLAttributes<HTMLElement>, 'onScroll'> {
     fade?: boolean | null | undefined;
     onScrollToBottom?: (() => void) | null | undefined;
@@ -8,5 +10,34 @@ export interface IslandContentInnerProps extends IslandContentProps {
     onScroll: (node: HTMLElement) => void;
     bottomBorder: boolean;
 }
-declare const ContentWrapper: (props: IslandContentProps) => JSX.Element;
+declare class Content extends Component<IslandContentInnerProps> {
+    static propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        className: PropTypes.Requireable<string>;
+        scrollableWrapperClassName: PropTypes.Requireable<string>;
+        fade: PropTypes.Requireable<boolean>;
+        bottomBorder: PropTypes.Requireable<boolean>;
+        onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+        onScrollToBottom: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    static defaultProps: {
+        fade: boolean;
+        bottomBorder: boolean;
+        onScroll: () => void;
+        onScrollToBottom: () => void;
+    };
+    state: {
+        scrolledToTop: boolean;
+        scrolledToBottom: boolean;
+    };
+    componentWillUnmount(): void;
+    resizeDetector: createResizeDetector.Erd;
+    wrapperNode?: HTMLElement | null;
+    setWrapper: (node: HTMLElement | null) => void;
+    calculateScrollPosition: () => void;
+    scrollableNode?: HTMLElement | null;
+    setScrollableNodeAndCalculatePosition: (node: HTMLElement | null) => void;
+    render(): JSX.Element;
+}
+declare const ContentWrapper: React.ForwardRefExoticComponent<IslandContentProps & React.RefAttributes<Content>>;
 export default ContentWrapper;

package/components/island/content.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { forwardRef, Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import createResizeDetector from 'element-resize-detector';
@@ -90,10 +90,11 @@ class Content extends Component {
       </div>);
     }
 }
-const ContentWrapper = (props) => (<ScrollHandlerContext.Consumer>
+const ContentWrapper = forwardRef((props, ref) => (<ScrollHandlerContext.Consumer>
     {onScroll => {
         const addProps = onScroll != null ? { onScroll, bottomBorder: true } : {};
-        return <Content {...props} {...addProps}/>;
+        return <Content {...props} {...addProps} ref={ref}/>;
     }}
-  </ScrollHandlerContext.Consumer>);
+  </ScrollHandlerContext.Consumer>));
+ContentWrapper.displayName = 'ContentWrapper';
 export default ContentWrapper;

package/components/island/island.d.ts

@@ -25,12 +25,10 @@ export declare const AdaptiveIsland: {
         };
         onContentScroll: ({ scrollTop, scrollHeight, clientHeight }: Element) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<IslandProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<IslandProps> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<IslandProps>;
         refs: {
             [key: string]: React.ReactInstance;
         };
@@ -53,12 +51,10 @@ export declare const AdaptiveIsland: {
         };
         onContentScroll: ({ scrollTop, scrollHeight, clientHeight }: Element) => void;
         render(): JSX.Element;
-        context: any;
+        context: unknown;
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<IslandProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<IslandProps> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<IslandProps>;
         refs: {
             [key: string]: React.ReactInstance;
         };

package/components/link/clickableLink.d.ts

@@ -13,7 +13,7 @@ export default class ClickableLink extends PureComponent<ClickableLinkProps> {
         onConditionalClick: PropTypes.Requireable<(...args: any[]) => any>;
         activeClassName: PropTypes.Requireable<string>;
         href: PropTypes.Validator<string>;
-        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        children: PropTypes.Validator<string | number | boolean | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
     };
     onClick: (e: React.MouseEvent<HTMLAnchorElement>) => void;
     render(): JSX.Element;