Enable @typescript-eslint/explicit-member-accessibility on /src (#9785)

* Enable `@typescript-eslint/explicit-member-accessibility` on /src

* Prettier

src/components/views/elements/AccessibleTooltipButton.tsx

@@ -36,14 +36,14 @@ interface IState {
 }
 
 export default class AccessibleTooltipButton extends React.PureComponent<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.state = {
             hover: false,
         };
     }
 
-    componentDidUpdate(prevProps: Readonly<IProps>) {
+    public componentDidUpdate(prevProps: Readonly<IProps>) {
         if (!prevProps.forceHide && this.props.forceHide && this.state.hover) {
             this.setState({
                 hover: false,
@@ -73,7 +73,7 @@ export default class AccessibleTooltipButton extends React.PureComponent<IProps,
         if (ev.relatedTarget) this.showTooltip();
     };
 
-    render() {
+    public render() {
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         const { title, tooltip, children, tooltipClassName, forceHide, alignment, onHideTooltip, ...props } =
             this.props;

src/components/views/elements/AppPermission.tsx

@@ -44,11 +44,11 @@ interface IState {
 }
 
 export default class AppPermission extends React.Component<IProps, IState> {
-    static defaultProps: Partial<IProps> = {
+    public static defaultProps: Partial<IProps> = {
         onPermissionGranted: () => {},
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         // The first step is to pick apart the widget so we can render information about it
@@ -88,7 +88,7 @@ export default class AppPermission extends React.Component<IProps, IState> {
         }
     }
 
-    render() {
+    public render() {
         const brand = SdkConfig.get().brand;
 
         const displayName = this.state.roomMember ? this.state.roomMember.name : this.props.creatorUserId;

src/components/views/elements/AppTile.tsx

@@ -104,7 +104,7 @@ interface IState {
 
 export default class AppTile extends React.Component<IProps, IState> {
     public static contextType = MatrixClientContext;
-    context: ContextType<typeof MatrixClientContext>;
+    public context: ContextType<typeof MatrixClientContext>;
 
     public static defaultProps: Partial<IProps> = {
         waitForIframeLoad: true,
@@ -126,7 +126,7 @@ export default class AppTile extends React.Component<IProps, IState> {
     private dispatcherRef: string;
     private unmounted: boolean;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         // Tiles in miniMode are floating, and therefore not docked

src/components/views/elements/DesktopCapturerSourcePicker.tsx

@@ -47,7 +47,7 @@ export interface ExistingSourceIProps {
 }
 
 export class ExistingSource extends React.Component<ExistingSourceIProps> {
-    constructor(props: ExistingSourceIProps) {
+    public constructor(props: ExistingSourceIProps) {
         super(props);
     }
 
@@ -55,7 +55,7 @@ export class ExistingSource extends React.Component<ExistingSourceIProps> {
         this.props.onSelect(this.props.source);
     };
 
-    render() {
+    public render() {
         const thumbnailClasses = classNames({
             mx_desktopCapturerSourcePicker_source_thumbnail: true,
             mx_desktopCapturerSourcePicker_source_thumbnail_selected: this.props.selected,
@@ -84,9 +84,9 @@ export interface PickerIProps {
 }
 
 export default class DesktopCapturerSourcePicker extends React.Component<PickerIProps, PickerIState> {
-    interval: number;
+    public interval: number;
 
-    constructor(props: PickerIProps) {
+    public constructor(props: PickerIProps) {
         super(props);
 
         this.state = {
@@ -96,7 +96,7 @@ export default class DesktopCapturerSourcePicker extends React.Component<PickerI
         };
     }
 
-    async componentDidMount() {
+    public async componentDidMount() {
         // window.setInterval() first waits and then executes, therefore
         // we call getDesktopCapturerSources() here without any delay.
         // Otherwise the dialog would be left empty for some time.
@@ -112,7 +112,7 @@ export default class DesktopCapturerSourcePicker extends React.Component<PickerI
         }, 500);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         clearInterval(this.interval);
     }
 
@@ -149,7 +149,7 @@ export default class DesktopCapturerSourcePicker extends React.Component<PickerI
         return new Tab(type, label, null, <div className="mx_desktopCapturerSourcePicker_tab">{sources}</div>);
     }
 
-    render() {
+    public render() {
         const tabs = [
             this.getTab("screen", _t("Share entire screen")),
             this.getTab("window", _t("Application window")),

src/components/views/elements/DialPadBackspaceButton.tsx

@@ -25,7 +25,7 @@ interface IProps {
 }
 
 export default class DialPadBackspaceButton extends React.PureComponent<IProps> {
-    render() {
+    public render() {
         return (
             <div className="mx_DialPadBackspaceButtonWrapper">
                 <AccessibleButton

src/components/views/elements/Draggable.tsx

@@ -34,7 +34,7 @@ export interface ILocationState {
 }
 
 export default class Draggable extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -73,7 +73,7 @@ export default class Draggable extends React.Component<IProps, IState> {
         });
     }
 
-    render() {
+    public render() {
         return <div className={this.props.className} onMouseDown={this.onMouseDown} />;
     }
 }

src/components/views/elements/Dropdown.tsx

@@ -35,7 +35,7 @@ interface IMenuOptionProps {
 }
 
 class MenuOption extends React.Component<IMenuOptionProps> {
-    static defaultProps = {
+    public static defaultProps = {
         disabled: false,
     };
 
@@ -49,7 +49,7 @@ class MenuOption extends React.Component<IMenuOptionProps> {
         this.props.onClick(this.props.dropdownKey);
     };
 
-    render() {
+    public render() {
         const optClasses = classnames({
             mx_Dropdown_option: true,
             mx_Dropdown_option_highlight: this.props.highlighted,
@@ -117,7 +117,7 @@ export default class Dropdown extends React.Component<DropdownProps, IState> {
     private ignoreEvent: MouseEvent = null;
     private childrenByKey: Record<string, ReactNode> = {};
 
-    constructor(props: DropdownProps) {
+    public constructor(props: DropdownProps) {
         super(props);
 
         this.reindexChildren(this.props.children);
@@ -149,7 +149,7 @@ export default class Dropdown extends React.Component<DropdownProps, IState> {
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         document.removeEventListener("click", this.onDocumentClick, false);
     }
 
@@ -327,7 +327,7 @@ export default class Dropdown extends React.Component<DropdownProps, IState> {
         return options;
     }
 
-    render() {
+    public render() {
         let currentValue;
 
         const menuStyle: CSSProperties = {};

src/components/views/elements/EditableItemList.tsx

@@ -57,7 +57,7 @@ export class EditableItem extends React.Component<IItemProps, IItemState> {
         this.setState({ verifyRemove: false });
     };
 
-    render() {
+    public render() {
         if (this.state.verifyRemove) {
             return (
                 <div className="mx_EditableItem">
@@ -148,7 +148,7 @@ export default class EditableItemList<P = {}> extends React.PureComponent<IProps
         );
     }
 
-    render() {
+    public render() {
         const editableItems = this.props.items.map((item, index) => {
             if (!this.props.canRemove) {
                 return <li key={item}>{item}</li>;

src/components/views/elements/EditableText.tsx

@@ -62,7 +62,7 @@ export default class EditableText extends React.Component<IProps, IState> {
         blurToSubmit: false,
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/EditableTextContainer.tsx

@@ -66,7 +66,7 @@ export default class EditableTextContainer extends React.Component<IProps, IStat
         },
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/ErrorBoundary.tsx

@@ -34,7 +34,7 @@ interface IState {
  * catch exceptions during rendering in the component tree below them.
  */
 export default class ErrorBoundary extends React.PureComponent<{}, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -42,13 +42,13 @@ export default class ErrorBoundary extends React.PureComponent<{}, IState> {
         };
     }
 
-    static getDerivedStateFromError(error: Error): Partial<IState> {
+    public static getDerivedStateFromError(error: Error): Partial<IState> {
         // Side effects are not permitted here, so we only update the state so
         // that the next render shows an error message.
         return { error };
     }
 
-    componentDidCatch(error: Error, { componentStack }: ErrorInfo): void {
+    public componentDidCatch(error: Error, { componentStack }: ErrorInfo): void {
         // Browser consoles are better at formatting output when native errors are passed
         // in their own `console.error` invocation.
         logger.error(error);
@@ -73,7 +73,7 @@ export default class ErrorBoundary extends React.PureComponent<{}, IState> {
         });
     };
 
-    render() {
+    public render() {
         if (this.state.error) {
             const newIssueUrl = "https://github.com/vector-im/element-web/issues/new/choose";
 

src/components/views/elements/EventListSummary.tsx

@@ -79,17 +79,17 @@ enum TransitionType {
 const SEP = ",";
 
 export default class EventListSummary extends React.Component<IProps> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
-    static defaultProps = {
+    public static defaultProps = {
         summaryLength: 1,
         threshold: 3,
         avatarsMaxLength: 5,
         layout: Layout.Group,
     };
 
-    shouldComponentUpdate(nextProps: IProps): boolean {
+    public shouldComponentUpdate(nextProps: IProps): boolean {
         // Update if
         //  - The number of summarised events has changed
         //  - or if the summary is about to toggle to become collapsed
@@ -451,7 +451,7 @@ export default class EventListSummary extends React.Component<IProps> {
         }
     }
 
-    getAggregate(userEvents: Record<string, IUserEvents[]>) {
+    public getAggregate(userEvents: Record<string, IUserEvents[]>) {
         // A map of aggregate type to arrays of display names. Each aggregate type
         // is a comma-delimited string of transitions, e.g. "joined,left,kicked".
         // The array of display names is the array of users who went through that
@@ -489,7 +489,7 @@ export default class EventListSummary extends React.Component<IProps> {
         };
     }
 
-    render() {
+    public render() {
         const eventsToRender = this.props.events;
 
         // Map user IDs to latest Avatar Member. ES6 Maps are ordered by when the key was created,

src/components/views/elements/EventTilePreview.tsx

@@ -63,7 +63,7 @@ interface IState {
 const AVATAR_SIZE = 32;
 
 export default class EventTilePreview extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.state = {
             message: props.message,

src/components/views/elements/Field.tsx

@@ -145,7 +145,7 @@ export default class Field extends React.PureComponent<PropShapes, IState> {
         });
     }, VALIDATION_THROTTLE_MS);
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             valid: undefined,

src/components/views/elements/IRCTimelineProfileResizer.tsx

@@ -33,7 +33,7 @@ interface IState {
 }
 
 export default class IRCTimelineProfileResizer extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -42,7 +42,7 @@ export default class IRCTimelineProfileResizer extends React.Component<IProps, I
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.setState(
             {
                 IRCLayoutRoot: document.querySelector(".mx_IRCLayout"),
@@ -91,7 +91,7 @@ export default class IRCTimelineProfileResizer extends React.Component<IProps, I
         }
     };
 
-    render() {
+    public render() {
         return <Draggable className="mx_ProfileResizer" dragFunc={this.dragFunc} onMouseUp={this.onMoueUp} />;
     }
 }

src/components/views/elements/ImageView.tsx

@@ -91,7 +91,7 @@ interface IState {
 }
 
 export default class ImageView extends React.Component<IProps, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         const { thumbnailInfo } = this.props;
@@ -126,7 +126,7 @@ export default class ImageView extends React.Component<IProps, IState> {
     private animatingLoading = false;
     private imageIsLoaded = false;
 
-    componentDidMount() {
+    public componentDidMount() {
         // We have to use addEventListener() because the listener
         // needs to be passive in order to work with Chromium
         this.focusLock.current.addEventListener("wheel", this.onWheel, { passive: false });
@@ -136,7 +136,7 @@ export default class ImageView extends React.Component<IProps, IState> {
         this.image.current.addEventListener("load", this.imageLoaded);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.focusLock.current.removeEventListener("wheel", this.onWheel);
         window.removeEventListener("resize", this.recalculateZoom);
         this.image.current.removeEventListener("load", this.imageLoaded);
@@ -411,7 +411,7 @@ export default class ImageView extends React.Component<IProps, IState> {
         return <React.Fragment>{contextMenu}</React.Fragment>;
     }
 
-    render() {
+    public render() {
         const showEventMeta = !!this.props.mxEvent;
 
         let transitionClassName;

src/components/views/elements/InfoTooltip.tsx

@@ -35,11 +35,11 @@ interface ITooltipProps {
 }
 
 export default class InfoTooltip extends React.PureComponent<ITooltipProps> {
-    constructor(props: ITooltipProps) {
+    public constructor(props: ITooltipProps) {
         super(props);
     }
 
-    render() {
+    public render() {
         const { tooltip, children, tooltipClassName, className, kind } = this.props;
         const title = _t("Information");
         const iconClassName =

src/components/views/elements/InlineSpinner.tsx

@@ -25,12 +25,12 @@ interface IProps {
 }
 
 export default class InlineSpinner extends React.PureComponent<IProps> {
-    static defaultProps = {
+    public static defaultProps = {
         w: 16,
         h: 16,
     };
 
-    render() {
+    public render() {
         return (
             <div className="mx_InlineSpinner">
                 <div

src/components/views/elements/InteractiveTooltip.tsx

@@ -308,7 +308,7 @@ export default class InteractiveTooltip extends React.Component<IProps, IState>
         side: Direction.Top,
     };
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {
@@ -317,7 +317,7 @@ export default class InteractiveTooltip extends React.Component<IProps, IState>
         };
     }
 
-    componentDidUpdate() {
+    public componentDidUpdate() {
         // Whenever this passthrough component updates, also render the tooltip
         // in a separate DOM tree. This allows the tooltip content to participate
         // the normal React rendering cycle: when this component re-renders, the
@@ -327,7 +327,7 @@ export default class InteractiveTooltip extends React.Component<IProps, IState>
         this.renderTooltip();
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         document.removeEventListener("mousemove", this.onMouseMove);
     }
 
@@ -486,7 +486,7 @@ export default class InteractiveTooltip extends React.Component<IProps, IState>
         ReactDOM.render(tooltip, getOrCreateContainer());
     }
 
-    render() {
+    public render() {
         return this.props.children({
             ref: this.collectTarget,
             onMouseOver: this.onTargetMouseOver,

src/components/views/elements/InviteReason.tsx

@@ -30,7 +30,7 @@ interface IState {
 }
 
 export default class InviteReason extends React.PureComponent<IProps, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             // We hide the reason for invitation by default, since it can be a
@@ -39,13 +39,13 @@ export default class InviteReason extends React.PureComponent<IProps, IState> {
         };
     }
 
-    onViewClick = () => {
+    public onViewClick = () => {
         this.setState({
             hidden: false,
         });
     };
 
-    render() {
+    public render() {
         const classes = classNames({
             mx_InviteReason: true,
             mx_InviteReason_hidden: this.state.hidden,

src/components/views/elements/LanguageDropdown.tsx

@@ -42,7 +42,7 @@ interface IState {
 }
 
 export default class LanguageDropdown extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/LazyRenderList.tsx

@@ -17,7 +17,7 @@ limitations under the License.
 import React from "react";
 
 class ItemRange {
-    constructor(public topCount: number, public renderCount: number, public bottomCount: number) {}
+    public constructor(public topCount: number, public renderCount: number, public bottomCount: number) {}
 
     public contains(range: ItemRange): boolean {
         // don't contain empty ranges
@@ -85,7 +85,7 @@ export default class LazyRenderList<T = any> extends React.Component<IProps<T>,
         overflowMargin: 5,
     };
 
-    constructor(props: IProps<T>) {
+    public constructor(props: IProps<T>) {
         super(props);
 
         this.state = {

src/components/views/elements/LinkWithTooltip.tsx

@@ -21,7 +21,7 @@ import TextWithTooltip from "./TextWithTooltip";
 interface IProps extends Omit<React.ComponentProps<typeof TextWithTooltip>, "tabIndex" | "onClick"> {}
 
 export default class LinkWithTooltip extends React.Component<IProps> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
     }
 

src/components/views/elements/Measured.tsx

@@ -28,21 +28,21 @@ export default class Measured extends React.PureComponent<IProps> {
     private static instanceCount = 0;
     private readonly instanceId: number;
 
-    static defaultProps = {
+    public static defaultProps = {
         breakpoint: 500,
     };
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.instanceId = Measured.instanceCount++;
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         UIStore.instance.on(`Measured${this.instanceId}`, this.onResize);
     }
 
-    componentDidUpdate(prevProps: Readonly<IProps>) {
+    public componentDidUpdate(prevProps: Readonly<IProps>) {
         const previous = prevProps.sensor;
         const current = this.props.sensor;
         if (previous === current) return;
@@ -54,7 +54,7 @@ export default class Measured extends React.PureComponent<IProps> {
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         UIStore.instance.off(`Measured${this.instanceId}`, this.onResize);
         UIStore.instance.stopTrackingElementDimensions(`Measured${this.instanceId}`);
     }
@@ -64,7 +64,7 @@ export default class Measured extends React.PureComponent<IProps> {
         this.props.onMeasurement(entry.contentRect.width <= this.props.breakpoint);
     };
 
-    render() {
+    public render() {
         return null;
     }
 }

src/components/views/elements/PersistedElement.tsx

@@ -78,7 +78,7 @@ export default class PersistedElement extends React.Component<IProps> {
     private childContainer: HTMLDivElement;
     private child: HTMLDivElement;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.resizeObserver = new ResizeObserver(this.repositionChild);
@@ -107,7 +107,7 @@ export default class PersistedElement extends React.Component<IProps> {
         }
     }
 
-    static isMounted(persistKey) {
+    public static isMounted(persistKey) {
         return Boolean(getContainer("mx_persistedElement_" + persistKey));
     }
 

src/components/views/elements/PersistentApp.tsx

@@ -32,10 +32,10 @@ interface IProps {
 
 export default class PersistentApp extends React.Component<IProps> {
     public static contextType = MatrixClientContext;
-    context: ContextType<typeof MatrixClientContext>;
+    public context: ContextType<typeof MatrixClientContext>;
     private room: Room;
 
-    constructor(props: IProps, context: ContextType<typeof MatrixClientContext>) {
+    public constructor(props: IProps, context: ContextType<typeof MatrixClientContext>) {
         super(props, context);
         this.room = context.getRoom(this.props.persistentRoomId)!;
     }

src/components/views/elements/Pill.tsx

@@ -75,7 +75,7 @@ export default class Pill extends React.Component<IProps, IState> {
         return "@room".length;
     }
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/PollCreateDialog.tsx

@@ -256,7 +256,7 @@ export default class PollCreateDialog extends ScrollableBaseModal<IProps, IState
         );
     }
 
-    onPollTypeChange = (e: ChangeEvent<HTMLSelectElement>) => {
+    public onPollTypeChange = (e: ChangeEvent<HTMLSelectElement>) => {
         this.setState({
             kind: M_POLL_KIND_DISCLOSED.matches(e.target.value) ? M_POLL_KIND_DISCLOSED : M_POLL_KIND_UNDISCLOSED,
         });

src/components/views/elements/PowerSelector.tsx

@@ -60,7 +60,7 @@ export default class PowerSelector extends React.Component<IProps, IState> {
         usersDefault: 0,
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/ReplyChain.tsx

@@ -74,14 +74,14 @@ interface IState {
 // craft event_id's, using a homeserver that generates predictable event IDs; even then the impact would
 // be low as each event being loaded (after the first) is triggered by an explicit user action.
 export default class ReplyChain extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
     private unmounted = false;
     private room: Room;
     private blockquoteRef = React.createRef<HTMLQuoteElement>();
 
-    constructor(props: IProps, context: React.ContextType<typeof RoomContext>) {
+    public constructor(props: IProps, context: React.ContextType<typeof RoomContext>) {
         super(props, context);
 
         this.state = {
@@ -98,17 +98,17 @@ export default class ReplyChain extends React.Component<IProps, IState> {
         return MatrixClientPeg.get();
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.initialize();
         this.trySetExpandableQuotes();
     }
 
-    componentDidUpdate() {
+    public componentDidUpdate() {
         this.props.onHeightChanged();
         this.trySetExpandableQuotes();
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.unmounted = true;
     }
 
@@ -199,7 +199,7 @@ export default class ReplyChain extends React.Component<IProps, IState> {
         return getUserNameColorClass(ev.getSender()).replace("Username", "ReplyChain");
     }
 
-    render() {
+    public render() {
         let header = null;
         if (this.state.err) {
             header = (

src/components/views/elements/RoomAliasField.tsx

@@ -39,12 +39,12 @@ interface IState {
 
 // Controlled form component wrapping Field for inputting a room alias scoped to a given domain
 export default class RoomAliasField extends React.PureComponent<IProps, IState> {
-    static contextType = MatrixClientContext;
+    public static contextType = MatrixClientContext;
     public context!: React.ContextType<typeof MatrixClientContext>;
 
     private fieldRef = createRef<Field>();
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {
@@ -72,7 +72,7 @@ export default class RoomAliasField extends React.PureComponent<IProps, IState>
         return { prefix, postfix, value, maxlength };
     }
 
-    render() {
+    public render() {
         const { prefix, postfix, value, maxlength } = this.domainProps;
         return (
             <Field

src/components/views/elements/SettingsFlag.tsx

@@ -43,7 +43,7 @@ interface IState {
 }
 
 export default class SettingsFlag extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/elements/Slider.tsx

@@ -70,7 +70,7 @@ export default class Slider extends React.Component<IProps> {
         return 100 * (closest - 1 + linearInterpolation) * intervalWidth;
     }
 
-    render(): React.ReactNode {
+    public render(): React.ReactNode {
         const dots = this.props.values.map((v) => (
             <Dot
                 active={v <= this.props.value}
@@ -108,7 +108,7 @@ export default class Slider extends React.Component<IProps> {
         );
     }
 
-    onClick(event: React.MouseEvent) {
+    public onClick(event: React.MouseEvent) {
         const width = (event.target as HTMLElement).clientWidth;
         // nativeEvent is safe to use because https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/offsetX
         // is supported by all modern browsers
@@ -133,7 +133,7 @@ interface IDotProps {
 }
 
 class Dot extends React.PureComponent<IDotProps> {
-    render(): React.ReactNode {
+    public render(): React.ReactNode {
         let className = "mx_Slider_dot";
         if (!this.props.disabled && this.props.active) {
             className += " mx_Slider_dotActive";

src/components/views/elements/SpellCheckLanguagesDropdown.tsx

@@ -43,7 +43,7 @@ export default class SpellCheckLanguagesDropdown extends React.Component<
     SpellCheckLanguagesDropdownIProps,
     SpellCheckLanguagesDropdownIState
 > {
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.onSearchChange = this.onSearchChange.bind(this);
 
@@ -53,7 +53,7 @@ export default class SpellCheckLanguagesDropdown extends React.Component<
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         const plaf = PlatformPeg.get();
         if (plaf) {
             plaf.getAvailableSpellCheckLanguages()
@@ -82,7 +82,7 @@ export default class SpellCheckLanguagesDropdown extends React.Component<
         this.setState({ searchQuery });
     }
 
-    render() {
+    public render() {
         if (this.state.languages === null) {
             return <Spinner />;
         }

src/components/views/elements/Spoiler.tsx

@@ -26,7 +26,7 @@ interface IState {
 }
 
 export default class Spoiler extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.state = {
             visible: false,

src/components/views/elements/StyledCheckbox.tsx

@@ -38,7 +38,7 @@ export default class StyledCheckbox extends React.PureComponent<IProps, IState>
         className: "",
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         // 56^10 so unlikely chance of collision.
         this.id = this.props.id || "checkbox_" + randomString(10);

src/components/views/elements/TextWithTooltip.tsx

@@ -28,7 +28,7 @@ interface IProps extends HTMLAttributes<HTMLSpanElement> {
 }
 
 export default class TextWithTooltip extends React.Component<IProps> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
     }
 

src/components/views/elements/Tooltip.tsx

@@ -68,7 +68,7 @@ export default class Tooltip extends React.PureComponent<ITooltipProps, State> {
         alignment: Alignment.Natural,
     };
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {};

src/components/views/elements/TooltipButton.tsx

@@ -24,11 +24,11 @@ interface IProps {
 }
 
 export default class TooltipButton extends React.Component<IProps> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
     }
 
-    render() {
+    public render() {
         return (
             <TooltipTarget
                 className="mx_TooltipButton_container"

src/components/views/elements/TruncatedList.tsx

@@ -38,7 +38,7 @@ interface IProps {
 }
 
 export default class TruncatedList extends React.Component<IProps> {
-    static defaultProps = {
+    public static defaultProps = {
         truncateAt: 2,
         createOverflowElement(overflowCount, totalCount) {
             return <div>{_t("And %(count)s more...", { count: overflowCount })}</div>;