diff --git a/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 00000000000000..110fc80a260528
--- /dev/null
+++ b/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Update componentRef types",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 00000000000000..44f253f09522b1
--- /dev/null
+++ b/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Update createRef type",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 00000000000000..39fa5bda11fe9b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update componentRef types",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 9231023f6e94b6..de60ed112a184c 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -24,7 +24,7 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICommandBar) => void;
+  componentRef?: (component: ICommandBar | null) => void;
 
   /**
    * Items to render
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
index df410ca4b822be..74b779422d1ea2 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
@@ -17,7 +17,7 @@ export interface IBaseExtendedPicker<T> {
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBaseExtendedPickerProps<T> {
-  componentRef?: (component?: IBaseExtendedPicker<T>) => void;
+  componentRef?: (component?: IBaseExtendedPicker<T> | null) => void;
 
   /**
    * Header/title element for the picker
diff --git a/packages/experiments/src/components/Form/Form.types.ts b/packages/experiments/src/components/Form/Form.types.ts
index ae181f468c8cf8..6a531b5be8bef8 100644
--- a/packages/experiments/src/components/Form/Form.types.ts
+++ b/packages/experiments/src/components/Form/Form.types.ts
@@ -1,11 +1,14 @@
 /* tslint:disable:no-any */
 import * as React from 'react';
 
+export interface IForm {
+}
+
 /**
  * The props for Form
  */
 export interface IFormProps extends React.AllHTMLAttributes<HTMLFormElement> {
-  componentRef?: (component: any) => void;
+  componentRef?: (component: IForm | null) => void;
 
   /** The submit handler. Passes back results keyed by the names of the inputs */
   onSubmit?: (results: { [key: string]: any }) => void;
diff --git a/packages/experiments/src/components/Keytip/Keytip.types.ts b/packages/experiments/src/components/Keytip/Keytip.types.ts
index 9f5c4094c85956..5c9d5fadd2b952 100644
--- a/packages/experiments/src/components/Keytip/Keytip.types.ts
+++ b/packages/experiments/src/components/Keytip/Keytip.types.ts
@@ -11,7 +11,7 @@ export interface IKeytipProps {
    * Optional callback to access the Keytip component. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IKeytip) => void;
+  componentRef?: (component: IKeytip | null) => void;
 
   /**
    * Content to put inside the keytip
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
index c060857d2b8a04..807972d320c9cc 100644
--- a/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
@@ -7,7 +7,7 @@ export interface IKeytipLayerProps extends React.Props<KeytipLayer> {
    * Optional callback to access the KeytipLayer component. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: KeytipLayer) => void;
+  componentRef?: (component: KeytipLayer | null) => void;
 
   /**
    * The DOM ID to use as the hostId for the child keytips
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
index b0f82dfbaefe91..c737bdf20e4232 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
@@ -17,7 +17,7 @@ export interface ISelectedItemProps<T> extends IPickerItemProps<T> {
 // For example, if the picker is displaying persona's than type T could either be of Persona or Ipersona props
 // tslint:disable-next-line:no-any
 export interface IBaseSelectedItemsListProps<T> extends React.Props<any> {
-  componentRef?: (component?: IBaseSelectedItemsList<T>) => void;
+  componentRef?: (component?: IBaseSelectedItemsList<T> | null) => void;
 
   /**
    * The selection
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.types.ts b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
index 2a221f9ff398fe..8b8d01f8380a9a 100644
--- a/packages/experiments/src/components/Shimmer/Shimmer.types.ts
+++ b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
@@ -16,7 +16,7 @@ export interface IShimmerProps extends React.AllHTMLAttributes<HTMLElement> {
    * Optional callback to access the IShimmer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmer) => void;
+  componentRef?: (component: IShimmer | null) => void;
 
   /**
    * Sets the width of the shimmer wave wrapper in percentages.
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
index 4f5511464fd16c..75b4dc9e80477c 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
@@ -17,7 +17,7 @@ export interface IShimmerCircleProps extends React.AllHTMLAttributes<HTMLElement
    * Optional callback to access the IShimmerCircle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmerCircle) => void;
+  componentRef?: (component: IShimmerCircle | null) => void;
 
   /**
    * Sets the height of the circle.
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
index 976743a51c7575..12306c1f21f455 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
@@ -17,7 +17,7 @@ export interface IShimmerLineProps extends React.AllHTMLAttributes<HTMLElement>
    * Optional callback to access the IShimmerLine interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmerLine) => void;
+  componentRef?: (component: IShimmerLine | null) => void;
 
   /**
    * Sets the height of the rectangle.
diff --git a/packages/experiments/src/components/TilesList/TilesList.types.ts b/packages/experiments/src/components/TilesList/TilesList.types.ts
index 43636b91c24cfe..d61e6d3ebcb0fa 100644
--- a/packages/experiments/src/components/TilesList/TilesList.types.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.types.ts
@@ -107,7 +107,7 @@ export interface ITilesListProps<TItem> extends IBaseProps, React.Props<TilesLis
   /**
    * Component ref for the focus zone within the list. Use this to control auto-focus.
    */
-  focusZoneComponentRef?: (focusZone: IFocusZone) => void;
+  focusZoneComponentRef?: (focusZone: IFocusZone | null) => void;
   /**
    * Callback for when the active element within the list's FocusZone changes.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
index e1d976c987d230..aa5e655e96f4ba 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
@@ -45,7 +45,7 @@ export interface IAutofillProps extends
   /**
    * Gets the compoonent ref.
    */
-  componentRef?: (componentRef?: IAutofill) => void;
+  componentRef?: (componentRef?: IAutofill | null) => void;
 
   /**
    * The suggested autofill value that will display.
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
index 8f86b53001adc2..2fc3bfa3c8c513 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
@@ -13,7 +13,7 @@ export interface IBreadcrumbProps extends React.Props<Breadcrumb> {
    * Optional callback to access the IBreadcrumb interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IBreadcrumb) => void;
+  componentRef?: (component: IBreadcrumb | null) => void;
 
   /**
    * Collection of breadcrumbs to render
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index f0ceaad542dd6d..ecabfd26030d13 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -30,7 +30,7 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    * Optional callback to access the IButton interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IButton) => void;
+  componentRef?: (component: IButton | null) => void;
 
   /**
    * If provided, this component will be rendered as an anchor.
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
index a833fe1adc7a94..e3f731dcea3fb7 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
@@ -14,7 +14,7 @@ export interface ICalendarProps extends React.Props<Calendar> {
    * Optional callback to access the ICalendar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICalendar) => void;
+  componentRef?: (component: ICalendar | null) => void;
 
   /**
   * Callback issued when a date is selected
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index b238fa93c41525..80cf8f12fca3b2 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -16,7 +16,7 @@ export interface ICalloutProps {
    * Optional callback to access the ICallout interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICallout) => void;
+  componentRef?: (component: ICallout | null) => void;
 
   /**
    * The target that the Callout should try to position itself based on.
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.types.ts b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
index eaee9b82f93ccc..a4f350943605a8 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
@@ -7,7 +7,7 @@ export interface ICheckProps extends React.Props<CheckBase> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: ICheckProps) => void;
+  componentRef?: (component: ICheckProps | null) => void;
 
   /**
    * Whether or not this menu item is currently checked.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
index 2a9398d9e36c26..0cfcf54f9eeda6 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
@@ -23,7 +23,7 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICheckbox) => void;
+  componentRef?: (component: ICheckbox | null) => void;
 
   /**
    * Additional class name to provide on the root element, in addition to the ms-Checkbox class.
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
index c33df4544c589d..b6555eba09455b 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
@@ -11,7 +11,7 @@ export interface IChoiceGroupProps extends React.InputHTMLAttributes<HTMLElement
    * Optional callback to access the IChoiceGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IChoiceGroup) => void;
+  componentRef?: (component: IChoiceGroup | null) => void;
 
   /**
    * The options for the choice group.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
index 487e5246e2e6ed..ae4db0cb36c420 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
@@ -7,7 +7,7 @@ export interface IBeakProps extends React.Props<Beak> {
   /**
   * All props for your component are to be defined here.
   */
-  componentRef?: (component: IBeak) => void;
+  componentRef?: (component: IBeak | null) => void;
 
   /**
    * Beak width.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
index 5b836fa39ea09f..ebecf59fe72e56 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
@@ -8,7 +8,7 @@ export interface ICoachmark {
 }
 
 export interface ICoachmarkTypes extends React.Props<Coachmark> {
-  componentRef?: (component: ICoachmark) => void;
+  componentRef?: (component: ICoachmark | null) => void;
 
   /**
    * Get styles method.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
index cd95dd470a9532..693b311e77c52b 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
@@ -21,7 +21,7 @@ export interface IPositioningContainerTypes extends React.Props<PositioningConta
   /**
   * All props for your component are to be defined here.
   */
-  componentRef?: (component: IPositioningContainer) => void;
+  componentRef?: (component: IPositioningContainer | null) => void;
   /**
    * The target that the positioningContainer should try to position itself based on.
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index 4a8d53820f8b48..4b68598169e0a7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -33,7 +33,7 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Optional callback to access the IComboBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IComboBox) => void;
+  componentRef?: (component: IComboBox | null) => void;
 
   /**
    * Collection of options for this ComboBox
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
index fb74b38ee7ad44..216e55194332ce 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
@@ -13,7 +13,7 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICommandBar) => void;
+  componentRef?: (component: ICommandBar | null) => void;
 
   /**
    * Whether or not the search box is visible
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index fd8ef9bc01a7e2..915810920c1437 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -33,7 +33,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * Optional callback to access the IContextualMenu interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IContextualMenu) => void;
+  componentRef?: (component: IContextualMenu | null) => void;
 
   /**
    * The target that the ContextualMenu should try to position itself based on.
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 590ec481a33a4d..e9f3528982bc44 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -14,7 +14,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * Optional callback to access the IDatePicker interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDatePicker) => void;
+  componentRef?: (component: IDatePicker | null) => void;
 
   /**
    * Pass calendar props to calendar component
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 90fc0e39689047..c6bd6b1a8cd8c4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -33,7 +33,7 @@ export interface IDetailsHeader {
 }
 
 export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
-  componentRef?: (component: IDetailsHeader) => void;
+  componentRef?: (component: IDetailsHeader | null) => void;
   columns: IColumn[];
   selection: ISelection;
   selectionMode: SelectionMode;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index 4d5bddf037f5ed..f92a5a6caba835 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -44,7 +44,7 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
    * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDetailsList) => void;
+  componentRef?: (component: IDetailsList | null) => void;
 
   /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
   setKey?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
index 2803f1d35407fd..839156f1344b70 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
@@ -18,7 +18,7 @@ export interface IDialogProps extends React.Props<DialogBase>, IWithResponsiveMo
    * Optional callback to access the IDialog interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDialog) => void;
+  componentRef?: (component: IDialog | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
index 9aba2f5ced9a81..f1ec888b68723b 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
@@ -14,7 +14,7 @@ export interface IDialogContentProps extends React.Props<DialogContentBase> {
   * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
   * the public methods and properties of the component.
   */
-  componentRef?: (component: IDialogContent) => void;
+  componentRef?: (component: IDialogContent | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
index 47fa490d10f587..6d84a526010905 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
@@ -7,7 +7,7 @@ export interface IDialogFooterProps extends React.Props<DialogFooterBase> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: IDialogFooterProps) => void;
+  componentRef?: (component: IDialogFooterProps | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
index 8c6cc15d49aa1d..cab818126da4a7 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
@@ -19,7 +19,7 @@ export interface IDocumentCardProps extends React.Props<DocumentCard> {
    * Optional callback to access the IDocumentCard interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDocumentCard) => void;
+  componentRef?: (component: IDocumentCard | null) => void;
 
   /**
   * The type of DocumentCard to display.
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
index 2b1ee1f35d51fa..aa926f86c8e2e3 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
@@ -16,7 +16,7 @@ export interface IFacepileProps extends React.Props<Facepile> {
    * Optional callback to access the IFacepile interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFacepile) => void;
+  componentRef?: (component: IFacepile | null) => void;
 
   /**
    * Array of IPersonaProps that define each Persona.
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
index 59c0a35a08d896..4c9037b08a054b 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
@@ -12,7 +12,7 @@ export interface IFocusTrapZoneProps extends React.HTMLAttributes<HTMLDivElement
    * Optional callback to access the IFocusTrapZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFocusTrapZone) => void;
+  componentRef?: (component: IFocusTrapZone | null) => void;
 
   /**
    * Sets the HTMLElement to focus on when exiting the FocusTrapZone.
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index 234842b5d71f1c..0dc97c0307d821 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -30,7 +30,7 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    * Optional callback to access the IFocusZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFocusZone) => void;
+  componentRef?: (component: IFocusZone | null) => void;
 
   /**
    * Additional class name to provide on the root element, in addition to the ms-FocusZone class.
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
index 2b6584e452f67a..5311a003dd7cb5 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
@@ -42,7 +42,7 @@ export interface IGroupedListProps extends React.Props<GroupedList> {
    * Optional callback to access the IGroupedList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component?: IGroupedList) => void;
+  componentRef?: (component?: IGroupedList | null) => void;
 
   /** Optional class name to add to the root element. */
   className?: string;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
index 70961503288e3d..ad877018050c42 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
@@ -16,7 +16,7 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    * Optional callback to access the IExpandingCard interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IExpandingCard) => void;
+  componentRef?: (component: IExpandingCard | null) => void;
 
   /**
    *  Item to be returned with onRender functions
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
index 74bd1b29fdd857..1c5a70cfdea057 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
@@ -15,7 +15,7 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
    * Optional callback to access the IHoverCardHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IHoverCard) => void;
+  componentRef?: (component: IHoverCard | null) => void;
 
   /**
    * Additional properties to pass through for HoverCard, reference detail properties in IHoverCardProps
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
index 0485e377938031..46b85dbb7dcff3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
@@ -11,7 +11,7 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IImage) => void;
+  componentRef?: (component: IImage | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.types.ts b/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
index 8e16ec7be7cd02..6df484a69cb705 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
@@ -12,7 +12,7 @@ export interface ILabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>
    * Optional callback to access the ILabel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILabel) => void;
+  componentRef?: (component: ILabel | null) => void;
 
   /**
    * Whether the associated form field is required or not
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
index 7b4151727ecdfe..ee5559b26a7d9d 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
@@ -12,7 +12,7 @@ export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | Layer
    * Optional callback to access the ILayer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILayer) => void;
+  componentRef?: (component: ILayer | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
index 2b87417a7e269f..470bf0f5d33d29 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
@@ -9,7 +9,7 @@ export interface ILayerHostProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the ILayerHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILayerHost) => void;
+  componentRef?: (component: ILayerHost | null) => void;
 
   /**
    * Defines the id for the layer host that Layers can target (using the hostId property.)
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
index 9ada1d9d5aedf0..b71ef6d36018d5 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
@@ -19,7 +19,7 @@ export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement |
    * Optional callback to access the ILink interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILink) => void;
+  componentRef?: (component: ILink | null) => void;
 
   /**
    * Whether the link is disabled
diff --git a/packages/office-ui-fabric-react/src/components/List/List.types.ts b/packages/office-ui-fabric-react/src/components/List/List.types.ts
index 2bc6e4cdd30535..315f2b60123f6f 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.types.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.types.ts
@@ -21,7 +21,7 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
    * Optional callback to access the IList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IList) => void;
+  componentRef?: (component: IList | null) => void;
 
   /** Optional classname to append to root list. */
   className?: string;
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
index 858ca0aeaecec8..74a4508db6291d 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
@@ -11,7 +11,7 @@ export interface IMarqueeSelectionProps extends React.Props<MarqueeSelection> {
    * Optional callback to access the IMarqueeSelection interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IMarqueeSelection) => void;
+  componentRef?: (component: IMarqueeSelection | null) => void;
 
   /**
    * The selection object to interact with when updating selection changes.
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
index 43922025a38222..67007e0bf79655 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
@@ -10,7 +10,7 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the IMessageBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IMessageBar) => void;
+  componentRef?: (component: IMessageBar | null) => void;
 
   /**
    * The type of MessageBar to render.
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
index 8aa8059196d66a..b4a8475c20f5be 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
@@ -15,7 +15,7 @@ export interface IModalProps extends React.Props<Modal>, IWithResponsiveModeStat
    * Optional callback to access the IDialog interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IModal) => void;
+  componentRef?: (component: IModal | null) => void;
 
   /**
   * Whether the dialog is displayed.
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index d499f4bb520413..ff4b7897c4b517 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -18,7 +18,7 @@ export interface INavProps {
    * Optional callback to access the INav interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: INav) => void;
+  componentRef?: (component: INav | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
index 8a1ba3d6d5baac..3930f92d1cf039 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
@@ -14,7 +14,7 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (ref?: IOverflowSet) => void;
+  componentRef?: (ref?: IOverflowSet | null) => void;
 
   /**
    * Class name
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
index c6e2810e8ea101..7358f03982faae 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
@@ -10,7 +10,7 @@ export interface IOverlayProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: IOverlayProps) => void;
+  componentRef?: (component: IOverlayProps | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
index 1e6acd0c9f70f2..5cc96d583a7536 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
@@ -20,7 +20,7 @@ export interface IPanelProps extends React.Props<Panel> {
    * Optional callback to access the IPanel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPanel) => void;
+  componentRef?: (component: IPanel | null) => void;
 
   /**
   * Whether the panel is displayed.
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index eb0ee0d442acb8..07c061f76b0818 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -14,7 +14,7 @@ export interface IPersonaProps extends React.HTMLAttributes<PersonaBase> {
    * Optional callback to access the IPersona interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPersona) => void;
+  componentRef?: (component: IPersona | null) => void;
 
   /**
    * Primary text to display, usually the name of the person.
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
index df53f832a8337c..372f5d52085b92 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
@@ -12,7 +12,7 @@ export interface IPivotProps extends React.Props<Pivot> {
    * Optional callback to access the IPivot interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPivot) => void;
+  componentRef?: (component: IPivot | null) => void;
 
   /**
    * The index of the pivot item initially selected.
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts b/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
index 03a92f97f4ece6..d49339eb57e6ae 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
@@ -12,7 +12,7 @@ export interface IPopupProps extends React.HTMLAttributes<Popup> {
    * Optional callback to access the IPopup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPopup) => void;
+  componentRef?: (component: IPopup | null) => void;
 
   /**
    * Aria role for popup
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
index e920ff538f3878..b1bb692efdecda 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
@@ -7,7 +7,7 @@ export interface IProgressIndicatorProps {
    * Optional callback to access the IProgressIndicator interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IProgressIndicator) => void;
+  componentRef?: (component: IProgressIndicator | null) => void;
 
   /**
    * Class name to apply to the root in addition to ms-ProgressIndicator.
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
index 675e210a5d1058..aef9d0b35cda51 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
@@ -17,7 +17,7 @@ export interface IRatingProps extends React.AllHTMLAttributes<HTMLElement> {
    * Optional callback to access the IRating interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IRating) => void;
+  componentRef?: (component: IRating | null) => void;
 
   /**
    * Selected rating, has to be an integer between min and max
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
index c65d6d34187482..28602a13281433 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
@@ -15,7 +15,7 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroupBase
    * Optional callback to access the IResizeGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IResizeGroup) => void;
+  componentRef?: (component: IResizeGroup | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index b1b432bb068ffe..41d1eb7a20d76f 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -16,7 +16,7 @@ export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement |
    * Optional callback to access the IScrollablePane interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IScrollablePane) => void;
+  componentRef?: (component: IScrollablePane | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 2aa62dea9593aa..c64d819f77706d 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -20,7 +20,7 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    * Optional callback to access the ISearchBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISearchBox) => void;
+  componentRef?: (component: ISearchBox | null) => void;
 
   /**
    * Placeholder for the search box.
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 147ad56e7e29ea..917e50e507dd35 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -86,7 +86,7 @@ describe('Slider', () => {
   });
 
   it('can read the current value', () => {
-    let slider: ISlider | undefined;
+    let slider: ISlider | null;
 
     ReactTestUtils.renderIntoDocument(
       // tslint:disable-next-line:jsx-no-lambda
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
index 2f3001ef0a82b9..c87a716ba15f00 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
@@ -11,7 +11,7 @@ export interface ISliderProps {
    * Optional callback to access the ISlider interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISlider) => void;
+  componentRef?: (component: ISlider | null) => void;
 
   /**
    * Description label of the Slider
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index 9320fccd844352..96bd3fa147e379 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -24,7 +24,7 @@ export interface ISpinButtonProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component?: ISpinButton) => void;
+  componentRef?: (component?: ISpinButton | null) => void;
 
   /**
    * The initial value of the SpinButton. Use this if you intend for the SpinButton to be an uncontrolled component.
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
index a0ed502efd8919..109022603e717a 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
@@ -12,7 +12,7 @@ export interface ISpinnerProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the ISpinner interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISpinner) => void;
+  componentRef?: (component: ISpinner | null) => void;
 
   /**
    * Deprecated and will be removed at >= 2.0.0. Use SpinnerSize instead.
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
index bad51e69235b40..4a482326731688 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
@@ -5,7 +5,7 @@ export interface IStickyProps extends React.Props<Sticky> {
   /**
    * Gets ref to component interface.
    */
-  componentRef?: (component: IStickyProps) => void;
+  componentRef?: (component: IStickyProps | null) => void;
 
   /**
    * Class name to apply to the sticky element if component is sticky.
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index b624363d295fb4..3a3238ec3f96db 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -8,7 +8,7 @@ export interface ISwatchColorPickerProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (componentRef?: ISwatchColorPicker) => void;
+  componentRef?: (componentRef?: ISwatchColorPicker | null) => void;
 
   /**
    * the number of columns for the swatch color picker
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
index 927dbbd597b0ff..fd1bb9855a0bc1 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
@@ -19,7 +19,7 @@ export interface ITeachingBubbleProps extends React.Props<TeachingBubble | Teach
    * Optional callback to access the ISlider interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITeachingBubble) => void;
+  componentRef?: (component: ITeachingBubble | null) => void;
 
   /**
    * Properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index 7f32537bc68d4c..44494d0ac8b520 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -40,7 +40,7 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
    * Optional callback to access the ITextField interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITextField) => void;
+  componentRef?: (component: ITextField | null) => void;
 
   /**
    * Whether or not the textfield is a multiline textfield.
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
index 41a3d7fe3745e9..7b7b25e121f44f 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
@@ -14,7 +14,7 @@ export interface IToggleProps extends React.HTMLAttributes<HTMLElement | Toggle>
    * Optional callback to access the IToggle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IToggle) => void;
+  componentRef?: (component: IToggle | null) => void;
 
   /**
    * A label for the toggle.
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
index ad7f40feeab7c4..fe7a97f8ebfec9 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
@@ -16,7 +16,7 @@ export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | Too
    * Optional callback to access the ITooltip interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITooltip) => void;
+  componentRef?: (component: ITooltip | null) => void;
 
   /**
    * Properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
index 27c7c51a1810b2..3328db2accac08 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
@@ -24,7 +24,7 @@ export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement |
    * Optional callback to access the ITooltipHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITooltipHost) => void;
+  componentRef?: (component: ITooltipHost | null) => void;
 
   /**
    * Additional properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index 50fa5c174c9a7e..5c5d3439a901a8 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -20,7 +20,7 @@ export interface IBasePicker<T> {
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBasePickerProps<T> extends React.Props<any> {
-  componentRef?: (component?: IBasePicker<T>) => void;
+  componentRef?: (component?: IBasePicker<T> | null) => void;
 
   /**
    * Function that specifies how the selected item will appear.
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
index 23168738afa551..be3cf01487a818 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
@@ -7,7 +7,7 @@ export interface IGridProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (componentRef?: IGrid) => void;
+  componentRef?: (componentRef?: IGrid | null) => void;
 
   /**
    * The items to turn into a grid
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
index 0a8e359c88a9c6..0cf44ed6efdadd 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
@@ -8,7 +8,7 @@ export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T
   * Optional callback to access the ISelectableDroppableText interface. Use this instead of ref for accessing
   * the public methods and properties of the component.
   */
-  componentRef?: (component: T) => void;
+  componentRef?: (component: T | null) => void;
 
   /**
    * Descriptive label for the ISelectableDroppableText
diff --git a/packages/utilities/src/createRef.ts b/packages/utilities/src/createRef.ts
index 0f145b9ed94399..b08cd78f3290e0 100644
--- a/packages/utilities/src/createRef.ts
+++ b/packages/utilities/src/createRef.ts
@@ -1,5 +1,5 @@
 export type RefObject<T> = {
-  (component: T): void;
+  (component: T | null): void;
   value: T | null;
 };