Explicit returns on typescript functions

packages/react-components/.eslintrc.js

@@ -45,7 +45,8 @@ module.exports = {
                 "no-param-reassign": "off",
                 "@typescript-eslint/no-explicit-any": "off",
 
-                "jsx-control-statements/jsx-jcs-no-undef": "off"
+                "jsx-control-statements/jsx-jcs-no-undef": "off",
+                "@typescript-eslint/explicit-function-return-type": ["warn", { allowExpressions: true }]
             }
         }
     ],

packages/react-components/src/shared/src/OLD_resolvePopperPosition.ts

@@ -1,3 +1,3 @@
-export function resolvePopperPosition(upward: boolean, direction: "left" | "right") {
+export function resolvePopperPosition(upward: boolean, direction: "left" | "right"): string {
     return `${upward ? "top" : "bottom"}-${direction === "left" ? "end" : "start"}`;
 }

packages/react-components/src/shared/src/arrayify.ts

@@ -1,3 +1,3 @@
-export function arrayify<T>(value: T | T[]) {
+export function arrayify<T>(value: T | T[]): T[] {
     return Array.isArray(value) ? value : [value];
 }

packages/react-components/src/shared/src/augmentElement.tsx

@@ -5,13 +5,13 @@ import { normalizeSize } from "./normalizeSize";
 import React, { ElementType, HTMLAttributes, ReactElement, RefAttributes, cloneElement } from "react";
 import type { SizeAdapter } from "./createSizeAdapter";
 
-export function augmentElement(element: ReactElement & RefAttributes<any>, newProps: Record<string, any>) {
+export function augmentElement(element: ReactElement & RefAttributes<any>, newProps: Record<string, any>): ReactElement {
     const augmentedProps = mergeProps({ ...element.props, ref: element.ref }, newProps);
 
     return cloneElement(element, augmentedProps);
 }
 
-export function createOrAugmentElement<T extends string, P extends HTMLAttributes<T>>(element: ReactElement<P, T> | ElementType, props: P) {
+export function createOrAugmentElement<T extends string, P extends HTMLAttributes<T>>(element: ReactElement<P, T> | ElementType, props: P): ReactElement {
     if (isValidElementType(element) && !isString(element)) {
         const Type = element;
 

packages/react-components/src/shared/src/createSizeAdapter.ts

@@ -3,10 +3,10 @@ import type { Size } from "./size";
 
 export type SizeAdapter = Record<Size, Size>;
 
-export function createSizeAdapter(adapter: SizeAdapter) {
+export function createSizeAdapter(adapter: SizeAdapter): (size: Size) => Size {
     return (size: Size) => adapter[normalizeSize(size)];
 }
 
-export function adaptSize(size: Size, adapter: SizeAdapter) {
+export function adaptSize(size: Size, adapter: SizeAdapter): Size {
     return adapter[normalizeSize(size)];
 }

packages/react-components/src/shared/src/cssModule.ts

@@ -1,4 +1,4 @@
-export function cssModule(moduleName: string, ...values: (false | string)[]) {
+export function cssModule(moduleName: string, ...values: (false | string)[]): string {
     const classes = values
         .filter(Boolean)
         .map(x => `${moduleName}-${x}`);

packages/react-components/src/shared/src/focusableTreeWalker.ts

@@ -24,7 +24,7 @@ interface FocusableTreeWalkerOptions {
     tabbable?: boolean;
 }
 
-export function createFocusableTreeWalker(root: HTMLElement, { tabbable }: FocusableTreeWalkerOptions = {}) {
+export function createFocusableTreeWalker(root: HTMLElement, { tabbable }: FocusableTreeWalkerOptions = {}): TreeWalker {
     const selector = tabbable ? TabbableElementSelector : FocusableElementSelector;
 
     const walker = document.createTreeWalker(
@@ -45,6 +45,6 @@ export function createFocusableTreeWalker(root: HTMLElement, { tabbable }: Focus
     return walker;
 }
 
-export function walkFocusableElements(root: HTMLElement, onElement: (element: Element, index?: number) => void) {
+export function walkFocusableElements(root: HTMLElement, onElement: (element: Element, index?: number) => void): void {
     root.querySelectorAll(FocusableElementSelector).forEach((x, index) => onElement(x, index));
 }

packages/react-components/src/shared/src/mergeClasses.ts

@@ -1,4 +1,4 @@
-export function mergeClasses(...values: (string | false)[]) {
+export function mergeClasses(...values: (string | false)[]): string {
     const deduped = (values
         .filter(Boolean) as string[])
         .reduce((set, x) => {

packages/react-components/src/shared/src/mergeProps.ts

@@ -12,7 +12,7 @@ interface CompositeKeyWeakMapNode<T> {
 export class CompositeKeyWeakMap<T> {
     _root = new WeakMap<any, any>();
 
-    set(keys: any[], value: T) {
+    set(keys: any[], value: T): void {
         let node: WeakMap<any, any> | CompositeKeyWeakMapNode<T> = this._root;
 
         for (let i = 0; i < keys.length; i += 1) {
@@ -35,7 +35,7 @@ export class CompositeKeyWeakMap<T> {
         (node as CompositeKeyWeakMapNode<T>).value = value;
     }
 
-    get(keys: any[]) {
+    get(keys: any[]): T {
         let node: WeakMap<any, any> | CompositeKeyWeakMapNode<T> = this._root;
 
         for (let i = 0; i < keys.length; i += 1) {
@@ -50,7 +50,7 @@ export class CompositeKeyWeakMap<T> {
         return (node as CompositeKeyWeakMapNode<T>).value;
     }
 
-    has(keys: any[]) {
+    has(keys: any[]): boolean {
         return !isUndefined(this.get(keys));
     }
 }
@@ -59,7 +59,7 @@ export class CompositeKeyWeakMap<T> {
 
 const cache = new CompositeKeyWeakMap<any>();
 
-function memoMerge<TFirst, TSecond, TOutput>(x: TFirst, y: TSecond, fct: (y: TSecond, x: TFirst) => TOutput) {
+function memoMerge<TFirst, TSecond, TOutput>(x: TFirst, y: TSecond, fct: (y: TSecond, x: TFirst) => TOutput): undefined | TFirst | TSecond | TOutput {
     if (isNil(x) && isNil(y)) {
         return undefined;
     }
@@ -86,7 +86,7 @@ function memoMerge<TFirst, TSecond, TOutput>(x: TFirst, y: TSecond, fct: (y: TSe
     return mergeResult;
 }
 
-function merge(props: any, newProps: any) {
+function merge(props: any, newProps: any): any {
     Object
         .keys(newProps)
         .forEach(x => {
@@ -117,7 +117,7 @@ function merge(props: any, newProps: any) {
 type TupleTypes<T> = { [P in keyof T]: T[P] } extends { [key: number]: infer V } ? V : never;
 type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends ((k: infer I) => void) ? I : never;
 
-export function mergeProps<T extends Record<string, any>[]>(...args: T) {
+export function mergeProps<T extends Record<string, any>[]>(...args: T): UnionToIntersection<TupleTypes<T>> {
     let result = {};
 
     args.forEach(x => {

packages/react-components/src/shared/src/omitProps.ts

@@ -1,4 +1,4 @@
-export function omitProps<TObject extends Record<string, any>, TKey extends keyof TObject>(obj: TObject, props: TKey[]) {
+export function omitProps<TObject extends Record<string, any>, TKey extends keyof TObject>(obj: TObject, props: TKey[]): Omit<TObject, TKey> {
     return Object.keys(obj)
         .reduce((acc: Record<string, any>, x: string) => {
             if (!props.includes(x as TKey)) {

packages/react-components/src/shared/src/resolveChildren.ts

@@ -2,7 +2,7 @@ import { Fragment, ReactElement, ReactNode } from "react";
 import { isFunction, isNil } from "lodash";
 
 // Support first level fragment: https://github.com/facebook/react/issues/11859.
-export function resolveFragment(children: ReactNode) {
+export function resolveFragment(children: ReactNode): ReactNode {
     if (!isNil(children) && (children as ReactElement).type === Fragment) {
         return (children as ReactElement).props.children;
     }

packages/react-components/src/shared/src/semantic-ui/SemanticRef.tsx

@@ -1,13 +1,13 @@
 import { Ref } from "semantic-ui-react";
 import { isNil } from "lodash";
-import React, { Ref as InnerRef, ReactElement } from "react";
+import React, { Ref as InnerRef, ReactElement, ReactNode } from "react";
 
 interface SemanticRefProps {
     innerRef: InnerRef<HTMLElement> | null
     children: ReactElement
 }
 
-export function SemanticRef({ innerRef, children }: SemanticRefProps) {
+export function SemanticRef({ innerRef, children }: SemanticRefProps): ReactNode {
     if (!isNil(innerRef)) {
         return (
             <Ref innerRef={innerRef}>

packages/react-components/src/shared/src/semantic-ui/throwWhenUnsupportedPropIsProvided.ts

@@ -1,7 +1,7 @@
 import { IS_PRODUCTION } from "../OLD_env";
 import { isNil } from "lodash";
 
-export function throwWhenUnsupportedPropIsProvided(props: Record<string, any>, unsupportedProps: string[], componentName: string) {
+export function throwWhenUnsupportedPropIsProvided(props: Record<string, any>, unsupportedProps: string[], componentName: string): void {
     if (!IS_PRODUCTION) {
         unsupportedProps.forEach(x => {
             if (!isNil(props[x])) {

packages/react-components/src/shared/src/slots.tsx

@@ -8,7 +8,7 @@ interface SlottedElement {
     [SLOT_KEY]?: string;
 }
 
-function slotDecorator<P>(slotName: string, ElementType: P) {
+function slotDecorator<P>(slotName: string, ElementType: P): P {
     (ElementType as Record<string, unknown>)[SLOT_KEY] = slotName;
 
     return ElementType;
@@ -24,7 +24,7 @@ interface Slots {
     [x: string]: any;
 }
 
-export function getSlots(children: ReactNode, { _ = {}, ...slots }: Slots) {
+export function getSlots(children: ReactNode, { _ = {}, ...slots }: Slots): Record<string, unknown> {
     const slotElements: Record<string, unknown> = {};
 
     children = resolveChildren(children);
@@ -83,6 +83,6 @@ export function getSlots(children: ReactNode, { _ = {}, ...slots }: Slots) {
     return slotElements;
 }
 
-export function useSlots(children: ReactElement, slots: Slots) {
+export function useSlots(children: ReactElement, slots: Slots): Record<string, unknown> {
     return useMemo(() => getSlots(children, slots), [children, slots]);
 }

packages/react-components/src/shared/src/styles.ts

@@ -7,7 +7,7 @@ export const StyleContext = createContext<StyleContextProps>(undefined);
 
 export const StyleProvider = StyleContext.Provider;
 
-export function useStyleContext() {
+export function useStyleContext(): StyleContextProps {
     return useContext(StyleContext);
 }
 

packages/react-components/src/shared/src/useAutoFocus.ts

@@ -12,7 +12,7 @@ interface AutoFocusOptions extends FocusOptions {
     delay?: number;
 }
 
-function useAbstractAutoFocus({ isDisabled, delay, onFocus }: AutoFocusOptions) {
+function useAbstractAutoFocus({ isDisabled, delay, onFocus }: AutoFocusOptions): void {
     useEffect(() => {
         const d = disposables();
 
@@ -30,7 +30,7 @@ function useAbstractAutoFocus({ isDisabled, delay, onFocus }: AutoFocusOptions)
     }, [isDisabled, delay, onFocus]);
 }
 
-export function useAutoFocus<T extends HTMLElement>(targetRef: MutableRefObject<T>, { isDisabled, delay, onFocus }: AutoFocusOptions = {}) {
+export function useAutoFocus<T extends HTMLElement>(targetRef: MutableRefObject<T>, { isDisabled, delay, onFocus }: AutoFocusOptions = {}): void {
     useAbstractAutoFocus({
         isDisabled,
         delay,
@@ -42,7 +42,7 @@ export function useAutoFocus<T extends HTMLElement>(targetRef: MutableRefObject<
     });
 }
 
-export function useAutoFocusChild(focusManager: FocusManager, { target = FocusTarget.first, isDisabled, delay, canFocus, onFocus, onNotFound }: AutoFocusOptions = {}) {
+export function useAutoFocusChild(focusManager: FocusManager, { target = FocusTarget.first, isDisabled, delay, canFocus, onFocus, onNotFound }: AutoFocusOptions = {}): void {
     useAbstractAutoFocus({
         isDisabled: isDisabled,
         delay,

packages/react-components/src/shared/src/useChainedEventCallback.ts

@@ -14,6 +14,6 @@ export function createChainedFunction<T extends ChainableFunction>(...funcs: (T
     };
 }
 
-export function useChainedEventCallback<T extends ChainableFunction>(...callbacks: (T | false)[]) {
+export function useChainedEventCallback<T extends ChainableFunction>(...callbacks: (T | false)[]): ChainableFunction {
     return useEventCallback(createChainedFunction(...callbacks));
 }

packages/react-components/src/shared/src/useCommittedRef.ts

@@ -1,8 +1,8 @@
 // Copied from https://github.com/react-restart/hooks/blob/master/src/useCommittedRef.ts.
 
-import { useEffect, useRef } from "react";
+import { MutableRefObject, useEffect, useRef } from "react";
 
-export function useCommittedRef<T>(value: T) {
+export function useCommittedRef<T>(value: T): MutableRefObject<T> {
     const ref = useRef(value);
 
     useEffect(() => {

packages/react-components/src/shared/src/useControllableState.ts

@@ -2,22 +2,29 @@ import { isFunction, isUndefined } from "lodash";
 import { useCallback, useRef } from "react";
 import { useRefState } from "./useRefState";
 
-function validatePrerequisites(controlledValue: any, initialValue: any) {
+function validatePrerequisites(controlledValue: any, initialValue: any): void {
     if (!isUndefined(controlledValue) && !isUndefined(initialValue)) {
         throw new Error(
             "useControllableState - A controllable state value can either have a controlled value or an initial value, but not both."
         );
     }
 }
 
-function ensureControlledStateHaveNotChanged(controlledValue: any, isControlled: any) {
+function ensureControlledStateHaveNotChanged(controlledValue: any, isControlled: any): void {
     if ((isControlled && isUndefined(controlledValue)) || (!isControlled && !isUndefined(controlledValue))) {
         throw new Error("useControllableState - A controllable state value cannot switch between controlled and uncontrolled. Did you inadvertently set a default value (defaultProps) for your controlled prop?");
     }
 }
 
-function useComputeInitialState<T>(controlledValue: T, initialValue: T, defaultValue: T) {
-    const result = (state: T, isControlled: boolean, isInitialState = false) => ({ state, isControlled, isInitialState });
+
+interface useComputeInitialStateResult<T> {
+    state: T;
+    isControlled: boolean;
+    isInitialState: boolean;
+}
+
+function useComputeInitialState<T>(controlledValue: T, initialValue: T, defaultValue: T): useComputeInitialStateResult<T> {
+    const result = (state: T, isControlled: boolean, isInitialState = false): useComputeInitialStateResult<T> => ({ state, isControlled, isInitialState });
 
     const hasComputedRef = useRef(false);
 
@@ -42,7 +49,7 @@ function useComputeInitialState<T>(controlledValue: T, initialValue: T, defaultV
     return result(state, isControlled, true);
 }
 
-function computeSubsequentState<T>(controlledValue: T, currentState: T, isControlled: boolean) {
+function computeSubsequentState<T>(controlledValue: T, currentState: T, isControlled: boolean): { newState: T; hasChanged: boolean; } {
     let newState: T | null = null;
     let hasChanged = false;
 
@@ -89,7 +96,7 @@ interface ControllableStateOptions<T> {
  *
  * setUncontrolledState("Neil Armstrong");
  */
-export function useControllableState<T>(controlledValue: T, initialValue: T, defaultValue: T, { onChange }: ControllableStateOptions<T> = {}) {
+export function useControllableState<T>(controlledValue: T, initialValue: T, defaultValue: T, { onChange }: ControllableStateOptions<T> = {}): [T, (maybeState: any) => void, boolean] {
     validatePrerequisites(controlledValue, initialValue);
 
     let { state: initialState, isControlled: isControlledProp, isInitialState } = useComputeInitialState(controlledValue, initialValue, defaultValue);

packages/react-components/src/shared/src/useDisposables.ts

@@ -4,8 +4,16 @@ import { useEffect, useState } from "react";
 // eslint-disable-next-line @typescript-eslint/ban-types
 type DisposableFunction = Function;
 
+interface DisposableAPI {
+    requestAnimationFrame(callback: FrameRequestCallback): void;
+    nextFrame(callback: FrameRequestCallback): void;
+    setTimeout(callback: (...args: any[]) => void, ms: number, ...args: any[]): void;
+    add(callback: DisposableFunction): void;
+    dispose(): void;
+}
+
 // Took from https://github.com/tailwindlabs/headlessui/blob/develop/packages/%40headlessui-react/src/utils/disposables.ts
-export function disposables() {
+export function disposables(): DisposableAPI {
     // eslint-disable-next-line no-shadow
     const _disposables: DisposableFunction[] = [];
 
@@ -36,7 +44,7 @@ export function disposables() {
     return api;
 }
 
-export function useDisposables() {
+export function useDisposables(): DisposableAPI {
     // Using useState instead of useRef so that we can use the initializer function.
     const [d] = useState(disposables);
 

packages/react-components/src/shared/src/useEventCallback.ts

@@ -4,7 +4,7 @@ import { isNil } from "lodash";
 import { useCallback } from "react";
 import { useCommittedRef } from "./useCommittedRef";
 
-export function useEventCallback<T extends (...args: any[]) => void>(callback: T) {
+export function useEventCallback<T extends (...args: any[]) => void>(callback: T): (...args: any[]) => void {
     const ref = useCommittedRef(callback);
 
     return useCallback((...args) => {

packages/react-components/src/shared/src/useEventListener.ts

@@ -1,7 +1,7 @@
 import { isFunction, isNil } from "lodash";
 import { useCallback, useEffect } from "react";
 
-export function useEventListener(eventTarget: EventTarget | (() => EventTarget), eventName: string, listener: EventListenerOrEventListenerObject | null, active = true, capture = false) {
+export function useEventListener(eventTarget: EventTarget | (() => EventTarget), eventName: string, listener: EventListenerOrEventListenerObject | null, active = true, capture = false): void {
     useEffect(() => {
         const target = isFunction(eventTarget) ? eventTarget() : eventTarget;
 
@@ -19,13 +19,13 @@ export function useEventListener(eventTarget: EventTarget | (() => EventTarget),
     }, [eventTarget, eventName, listener, active, capture]);
 }
 
-export function useDocumentListener(eventName: string, listener: EventListenerOrEventListenerObject | null, active: boolean, capture: boolean) {
+export function useDocumentListener(eventName: string, listener: EventListenerOrEventListenerObject | null, active: boolean, capture: boolean): void {
     const documentTarget = useCallback(() => document, []);
 
     useEventListener(documentTarget, eventName, listener, active, capture);
 }
 
-export function useWindowListener(eventName: string, listener: EventListenerOrEventListenerObject | null, active: boolean, capture: boolean) {
+export function useWindowListener(eventName: string, listener: EventListenerOrEventListenerObject | null, active: boolean, capture: boolean): void {
     const documentTarget = useCallback(() => window, []);
 
     useEventListener(documentTarget, eventName, listener, active, capture);