import types explicitly

Chance Strickland · Chance Strickland · commit bb23e80f07f0 · 2020-11-25T15:16:47.000-08:00
diff --git a/packages/accordion/src/index.tsx b/packages/accordion/src/index.tsx
@@ -23,7 +23,6 @@ import {
 } from "@reach/utils";
 import {
   createDescendantContext,
-  Descendant,
   DescendantProvider,
   useDescendant,
   useDescendantKeyDown,
@@ -32,6 +31,8 @@ import {
 import { useId } from "@reach/auto-id";
 import PropTypes from "prop-types";
 
+import type { Descendant } from "@reach/descendants";
+
 const AccordionDescendantContext = createDescendantContext<AccordionDescendant>(
   "AccordionDescendantContext"
 );
diff --git a/packages/alert-dialog/src/index.tsx b/packages/alert-dialog/src/index.tsx
@@ -31,12 +31,7 @@
  */
 
 import * as React from "react";
-import {
-  DialogOverlay,
-  DialogContent,
-  DialogProps,
-  DialogContentProps,
-} from "@reach/dialog";
+import { DialogOverlay, DialogContent } from "@reach/dialog";
 import { useId } from "@reach/auto-id";
 import {
   createNamedContext,
@@ -48,6 +43,8 @@ import {
 import invariant from "invariant";
 import PropTypes from "prop-types";
 
+import type { DialogProps, DialogContentProps } from "@reach/dialog";
+
 let AlertDialogContext = createNamedContext<AlertDialogContextValue>(
   "AlertDialogContext",
   {} as AlertDialogContextValue
diff --git a/packages/alert/src/index.tsx b/packages/alert/src/index.tsx
@@ -24,7 +24,7 @@
  */
 import * as React from "react";
 import * as ReactDOM from "react-dom";
-import VisuallyHidden from "@reach/visually-hidden";
+import { VisuallyHidden } from "@reach/visually-hidden";
 import {
   forwardRefWithAs,
   getOwnerDocument,
diff --git a/packages/checkbox/src/custom.tsx b/packages/checkbox/src/custom.tsx
@@ -42,13 +42,13 @@ import {
 } from "@reach/utils";
 import {
   internal_checkedPropToStateValue as checkedPropToStateValue,
-  MixedOrBool,
   internal_useControlledSwitchWarning as useControlledSwitchWarning,
   useMixedCheckbox,
-  UseMixedCheckboxProps,
 } from "./mixed";
 import PropTypes from "prop-types";
 
+import type { MixedOrBool, UseMixedCheckboxProps } from "./mixed";
+
 ////////////////////////////////////////////////////////////////////////////////
 
 const CustomCheckboxContext = createNamedContext(
diff --git a/packages/checkbox/src/mixed.tsx b/packages/checkbox/src/mixed.tsx
@@ -39,15 +39,11 @@ import {
   warning,
   wrapEvent,
 } from "@reach/utils";
-import {
-  assign,
-  MachineEventWithRefs,
-  StateMachine,
-  useCreateMachine,
-  useMachine,
-} from "@reach/machine";
+import { assign, useCreateMachine, useMachine } from "@reach/machine";
 import PropTypes from "prop-types";
 
+import type { MachineEventWithRefs, StateMachine } from "@reach/machine";
+
 // Used for development only, not recommended for production code!
 const DEBUG = false;
 
diff --git a/packages/combobox/src/index.tsx b/packages/combobox/src/index.tsx
@@ -36,15 +36,17 @@ import {
 } from "@reach/utils";
 import {
   createDescendantContext,
-  Descendant,
   DescendantProvider,
   useDescendant,
   useDescendants,
   useDescendantsInit,
 } from "@reach/descendants";
 import { findAll } from "highlight-words-core";
 import { useId } from "@reach/auto-id";
-import Popover, { positionMatchWidth, PopoverProps } from "@reach/popover";
+import { Popover, positionMatchWidth } from "@reach/popover";
+
+import type { PopoverProps } from "@reach/popover";
+import type { Descendant } from "@reach/descendants";
 
 ////////////////////////////////////////////////////////////////////////////////
 // States
diff --git a/packages/dialog/src/index.tsx b/packages/dialog/src/index.tsx
@@ -11,7 +11,7 @@
  */
 
 import * as React from "react";
-import Portal from "@reach/portal";
+import { Portal } from "@reach/portal";
 import {
   forwardRefWithAs,
   getOwnerDocument,
diff --git a/packages/listbox/src/index.tsx b/packages/listbox/src/index.tsx
@@ -27,10 +27,9 @@
 import * as React from "react";
 import PropTypes from "prop-types";
 import { useId } from "@reach/auto-id";
-import Popover, { PopoverProps, positionMatchWidth } from "@reach/popover";
+import { Popover, positionMatchWidth } from "@reach/popover";
 import {
   createDescendantContext,
-  Descendant,
   DescendantProvider,
   useDescendant,
   useDescendantKeyDown,
@@ -39,7 +38,6 @@ import {
 } from "@reach/descendants";
 import {
   createNamedContext,
-  DistributiveOmit,
   forwardRefWithAs,
   isBoolean,
   isFunction,
@@ -53,15 +51,22 @@ import {
   useIsomorphicLayoutEffect as useLayoutEffect,
   wrapEvent,
 } from "@reach/utils";
-import { StateMachine, useCreateMachine, useMachine } from "@reach/machine";
+import { useCreateMachine, useMachine } from "@reach/machine";
 import {
   createMachineDefinition,
   ListboxEvents,
   ListboxStates,
+} from "./machine";
+
+import type { Descendant } from "@reach/descendants";
+import type { DistributiveOmit } from "@reach/utils";
+import type { StateMachine } from "@reach/machine";
+import type {
   ListboxNodeRefs,
   ListboxStateData,
   ListboxEvent,
 } from "./machine";
+import type { PopoverProps } from "@reach/popover";
 
 const DEBUG = false;
 
diff --git a/packages/listbox/src/machine.ts b/packages/listbox/src/machine.ts
@@ -1,6 +1,8 @@
-import { assign, MachineEventWithRefs, StateMachine } from "@reach/machine";
+import { assign } from "@reach/machine";
 import { getOwnerDocument } from "@reach/utils";
-import { ListboxDescendant, ListboxValue } from "./index";
+
+import type { ListboxDescendant, ListboxValue } from "./index";
+import type { MachineEventWithRefs, StateMachine } from "@reach/machine";
 
 ////////////////////////////////////////////////////////////////////////////////
 // States
diff --git a/packages/machine/src/index.tsx b/packages/machine/src/index.tsx
@@ -2,13 +2,17 @@ import * as React from "react";
 import {
   assign,
   createMachine,
-  EventObject as MachineEvent,
   interpret,
   InterpreterStatus,
+} from "@xstate/fsm";
+import { isString, useConstant } from "@reach/utils";
+
+import type { DistributiveOmit } from "@reach/utils";
+import type {
+  EventObject as MachineEvent,
   StateMachine,
   Typestate,
 } from "@xstate/fsm";
-import { DistributiveOmit, isString, useConstant } from "@reach/utils";
 
 const getServiceState = <
   TContext extends object,
@@ -214,5 +218,5 @@ export type MachineService<
 > = StateMachine.Service<TC, TE>;
 
 // Export types and functions from xstate/fsm
-export { InterpreterStatus, MachineEvent, StateMachine };
-export { createMachine, assign, interpret };
+export type { MachineEvent, StateMachine };
+export { InterpreterStatus, createMachine, assign, interpret };
diff --git a/packages/menu-button/src/index.tsx b/packages/menu-button/src/index.tsx
@@ -14,10 +14,9 @@
 import * as React from "react";
 import PropTypes from "prop-types";
 import { useId } from "@reach/auto-id";
-import Popover, { Position } from "@reach/popover";
+import { Popover, Position } from "@reach/popover";
 import {
   createDescendantContext,
-  Descendant,
   DescendantProvider,
   useDescendant,
   useDescendants,
@@ -38,6 +37,8 @@ import {
   wrapEvent,
 } from "@reach/utils";
 
+import type { Descendant } from "@reach/descendants";
+
 ////////////////////////////////////////////////////////////////////////////////
 // Actions
 
diff --git a/packages/popover/src/index.tsx b/packages/popover/src/index.tsx
@@ -3,7 +3,7 @@
  */
 
 import * as React from "react";
-import Portal from "@reach/portal";
+import { Portal } from "@reach/portal";
 import { useRect, PRect } from "@reach/rect";
 import { forwardRefWithAs, getOwnerDocument, useForkedRef } from "@reach/utils";
 import tabbable from "tabbable";
@@ -68,8 +68,8 @@ const PopoverImpl = forwardRefWithAs<PopoverProps, "div">(function PopoverImpl(
   forwardedRef
 ) {
   const popoverRef = React.useRef<HTMLDivElement>(null);
-  const popoverRect = useRect(popoverRef, !props.hidden);
-  const targetRect = useRect(targetRef, !props.hidden);
+  const popoverRect = useRect(popoverRef, { observe: !props.hidden });
+  const targetRect = useRect(targetRef, { observe: !props.hidden });
   const ref = useForkedRef(popoverRef, forwardedRef);
 
   useSimulateTabNavigationForReactTree(targetRef, popoverRef);
diff --git a/packages/rect/src/index.tsx b/packages/rect/src/index.tsx
@@ -64,13 +64,13 @@ if (__DEV__) {
 
 function useRect<T extends Element = HTMLElement>(
   nodeRef: React.RefObject<T | undefined | null>,
-  observe?: UseRectOptions["observe"],
-  onChange?: UseRectOptions["onChange"]
+  options?: UseRectOptions
 ): null | DOMRect;
 
 function useRect<T extends Element = HTMLElement>(
   nodeRef: React.RefObject<T | undefined | null>,
-  options?: UseRectOptions
+  observe?: UseRectOptions["observe"],
+  onChange?: UseRectOptions["onChange"]
 ): null | DOMRect;
 
 /**
diff --git a/packages/tabs/src/index.tsx b/packages/tabs/src/index.tsx
@@ -20,7 +20,6 @@ import * as React from "react";
 import PropTypes from "prop-types";
 import {
   createDescendantContext,
-  Descendant,
   DescendantProvider,
   useDescendant,
   useDescendantKeyDown,
@@ -49,6 +48,8 @@ import {
 } from "@reach/utils";
 import { useId } from "@reach/auto-id";
 
+import type { Descendant } from "@reach/descendants";
+
 const TabsDescendantsContext = createDescendantContext<TabDescendant>(
   "TabsDescendantsContext"
 );
diff --git a/packages/tooltip/src/index.tsx b/packages/tooltip/src/index.tsx
@@ -54,8 +54,8 @@ import {
   wrapEvent,
   warning,
 } from "@reach/utils";
-import Portal from "@reach/portal";
-import VisuallyHidden from "@reach/visually-hidden";
+import { Portal } from "@reach/portal";
+import { VisuallyHidden } from "@reach/visually-hidden";
 import { useRect } from "@reach/rect";
 import PropTypes from "prop-types";
 
@@ -254,7 +254,7 @@ function useTooltip<T extends HTMLElement>({
   let ownRef = React.useRef<HTMLDivElement | null>(null);
 
   let ref = useForkedRef(forwardedRef as any, ownRef); // TODO: Fix in utils
-  let triggerRect = useRect(ownRef, isVisible);
+  let triggerRect = useRect(ownRef, { observe: isVisible });
 
   React.useEffect(() => {
     return subscribe(() => {
@@ -499,7 +499,7 @@ const TooltipContent = forwardRefWithAs<TooltipContentProps, "div">(
 
     let ownRef = React.useRef(null);
     let ref = useForkedRef(forwardedRef, ownRef);
-    let tooltipRect = useRect(ownRef, isVisible);
+    let tooltipRect = useRect(ownRef, { observe: isVisible });
     return (
       <React.Fragment>
         <Comp
diff --git a/packages/utils/src/index.tsx b/packages/utils/src/index.tsx
@@ -2,7 +2,7 @@
 
 import * as React from "react";
 import fbWarning from "warning";
-import {
+import type {
   As,
   AssignableRef,
   ComponentWithAs,
diff --git a/packages/utils/src/types.tsx b/packages/utils/src/types.tsx
@@ -2,8 +2,6 @@ import * as React from "react";
 // import { forwardRefWithAs } from './index';
 // import styled from 'styled-components';
 
-type ReactElement = React.ReactElement;
-
 /**
  * React.Ref uses the readonly type `React.RefObject` instead of
  * `React.MutableRefObject`, We pretty much always assume ref objects are
