diff --git a/client-app/src/admin/tests/cube/dimensions/DimensionManager.ts b/client-app/src/admin/tests/cube/dimensions/DimensionManager.ts
index 24de0cf4f..28b5fc770 100644
--- a/client-app/src/admin/tests/cube/dimensions/DimensionManager.ts
+++ b/client-app/src/admin/tests/cube/dimensions/DimensionManager.ts
@@ -1,8 +1,8 @@
 import {grid} from '@xh/hoist/cmp/grid';
 import {filler} from '@xh/hoist/cmp/layout';
-import {hoistCmp, useLocalModel, uses} from '@xh/hoist/core';
+import {hoistCmp, HoistProps, useLocalModel, uses, WithoutModelAndRef} from '@xh/hoist/core';
 import {groupingChooser} from '@xh/hoist/desktop/cmp/grouping';
-import {panel, PanelModel} from '@xh/hoist/desktop/cmp/panel';
+import {panel, PanelModel, PanelProps} from '@xh/hoist/desktop/cmp/panel';
 import {Icon} from '@xh/hoist/icon/Icon';
 import {DimensionManagerModel} from './DimensionManagerModel';
 
@@ -14,7 +14,11 @@ import {DimensionManagerModel} from './DimensionManagerModel';
  * This component and its backing model are incubating in Toolbox for possible inclusion in
  * the core Hoist toolkit in some form.
  */
-export const dimensionManager = hoistCmp.factory({
+export interface DimensionManagerProps
+    extends HoistProps<DimensionManagerModel>,
+        WithoutModelAndRef<PanelProps> {}
+
+export const dimensionManager = hoistCmp.factory<DimensionManagerProps>({
     displayName: 'DimensionManager',
     model: uses(DimensionManagerModel),
     className: 'xh-dim-manager',
diff --git a/client-app/src/admin/tests/grids/GridTestPanel.ts b/client-app/src/admin/tests/grids/GridTestPanel.ts
index 383b1168f..5087a6305 100644
--- a/client-app/src/admin/tests/grids/GridTestPanel.ts
+++ b/client-app/src/admin/tests/grids/GridTestPanel.ts
@@ -71,7 +71,7 @@ const tbar = hoistCmp.factory<GridTestModel>(({model}) =>
         toolbarSep(),
         refreshButton({
             text: 'Load Grid',
-            model
+            target: model
         }),
         button({
             text: 'Clear Grid',
diff --git a/client-app/src/core/cmp/WelcomeMsg.ts b/client-app/src/core/cmp/WelcomeMsg.ts
index 8066b579c..27795d0f7 100644
--- a/client-app/src/core/cmp/WelcomeMsg.ts
+++ b/client-app/src/core/cmp/WelcomeMsg.ts
@@ -1,8 +1,12 @@
-import {hoistCmp, XH} from '@xh/hoist/core';
+import {hoistCmp, HoistProps, XH} from '@xh/hoist/core';
 import {div, img, br} from '@xh/hoist/cmp/layout';
 import './WelcomeMsg.scss';
 
-export const welcomeMsg = hoistCmp.factory(({multiline}) => {
+interface WelcomeMsgProps extends HoistProps {
+    multiline?: boolean;
+}
+
+export const welcomeMsg = hoistCmp.factory<WelcomeMsgProps>(({multiline}) => {
     const user = XH.getUser();
     return div({
         className: `tb-welcome-message ${multiline ? 'tb-welcome-message--multiline' : ''}`,
diff --git a/client-app/src/desktop/common/grid/SampleTreeGrid.ts b/client-app/src/desktop/common/grid/SampleTreeGrid.ts
index 1351c0e89..04f4b7ea8 100644
--- a/client-app/src/desktop/common/grid/SampleTreeGrid.ts
+++ b/client-app/src/desktop/common/grid/SampleTreeGrid.ts
@@ -19,7 +19,7 @@ export const [SampleTreeGrid, sampleTreeGrid] = hoistCmp.withFactory({
             item: hframe(grid(), gridOptionsPanel({model: gridModel})),
             ref: model.panelRef,
             tbar: [
-                refreshButton({model}),
+                refreshButton({target: model}),
                 toolbarSep(),
                 groupingChooser(),
                 filler(),
diff --git a/client-app/src/desktop/common/grid/SampleTreeGridModel.ts b/client-app/src/desktop/common/grid/SampleTreeGridModel.ts
index ff2aae60c..e58e01074 100644
--- a/client-app/src/desktop/common/grid/SampleTreeGridModel.ts
+++ b/client-app/src/desktop/common/grid/SampleTreeGridModel.ts
@@ -34,7 +34,7 @@ export class SampleTreeGridModel extends HoistModel {
     @managed
     gridModel: GridModel;
 
-    panelRef = createRef<HTMLElement>();
+    panelRef = createRef<HTMLDivElement>();
 
     get store() {
         return this.gridModel.store;
diff --git a/client-app/src/desktop/tabs/grids/DataViewPanel.tsx b/client-app/src/desktop/tabs/grids/DataViewPanel.tsx
index 730f61b12..f7a0558af 100644
--- a/client-app/src/desktop/tabs/grids/DataViewPanel.tsx
+++ b/client-app/src/desktop/tabs/grids/DataViewPanel.tsx
@@ -31,7 +31,7 @@ export const dataViewPanel = hoistCmp.factory({
                 bbar: [
                     refreshButton({
                         text: 'Load new (random) records',
-                        model
+                        target: model
                     }),
                     filler(),
                     storeFilterField({store: model.dataViewModel.store})
diff --git a/client-app/src/desktop/tabs/layout/widgets/ChartWidget.ts b/client-app/src/desktop/tabs/layout/widgets/ChartWidget.ts
index 5d67587a4..c4c5ae015 100644
--- a/client-app/src/desktop/tabs/layout/widgets/ChartWidget.ts
+++ b/client-app/src/desktop/tabs/layout/widgets/ChartWidget.ts
@@ -1,4 +1,4 @@
-import {creates, hoistCmp, lookup, managed} from '@xh/hoist/core';
+import {creates, hoistCmp, HoistPropsWithModel, lookup, managed} from '@xh/hoist/core';
 import {box} from '@xh/hoist/cmp/layout';
 import {panel, PanelModel} from '@xh/hoist/desktop/cmp/panel';
 import {buttonGroupInput, select} from '@xh/hoist/desktop/cmp/input';
@@ -37,8 +37,9 @@ export const chartWidget = hoistCmp.factory({
     }
 });
 
-const rangeSelector = hoistCmp.factory(() =>
+const rangeSelector = hoistCmp.factory<HoistPropsWithModel>(({model}) =>
     buttonGroupInput({
+        model,
         bind: 'range',
         items: [
             button({text: '7D', value: 7}),
diff --git a/client-app/src/desktop/tabs/panels/BasicPanel.tsx b/client-app/src/desktop/tabs/panels/BasicPanel.tsx
index 822bdfa7a..fd1bcc8be 100644
--- a/client-app/src/desktop/tabs/panels/BasicPanel.tsx
+++ b/client-app/src/desktop/tabs/panels/BasicPanel.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {ReactElement} from 'react';
 import {creates, hoistCmp, XH} from '@xh/hoist/core';
 import {div, filler, p} from '@xh/hoist/cmp/layout';
 import {menu, menuDivider, menuItem, popover} from '@xh/hoist/kit/blueprint';
@@ -99,7 +99,7 @@ export const basicPanel = hoistCmp.factory({
                             menuItem({text: 'Menu Item 2', icon: Icon.skull(), intent: 'danger'}),
                             menuItem({
                                 text: 'Menu Item 3',
-                                icon: Icon.placeholder(),
+                                icon: Icon.placeholder() as ReactElement,
                                 disabled: true
                             }),
                             menuDivider({title: 'Another Section'}),
diff --git a/client-app/src/examples/portfolio/GridPanel.ts b/client-app/src/examples/portfolio/GridPanel.ts
index 0c02b5b31..6e0f76e86 100644
--- a/client-app/src/examples/portfolio/GridPanel.ts
+++ b/client-app/src/examples/portfolio/GridPanel.ts
@@ -30,7 +30,7 @@ export const gridPanel = hoistCmp.factory({
                 gridCountLabel({unit: 'position'}),
                 filler(),
                 relativeTimestamp({bind: 'loadTimestamp'}),
-                refreshButton({model: XH.refreshContextModel, intent: 'success'})
+                refreshButton({target: XH.refreshContextModel, intent: 'success'})
             ]
         });
     }
diff --git a/client-app/src/examples/todo/TodoPanelModel.ts b/client-app/src/examples/todo/TodoPanelModel.ts
index 10f0b5580..d6729ae66 100644
--- a/client-app/src/examples/todo/TodoPanelModel.ts
+++ b/client-app/src/examples/todo/TodoPanelModel.ts
@@ -29,7 +29,7 @@ export class TodoPanelModel extends HoistModel {
     @managed
     gridModel: GridModel;
 
-    panelRef = createRef<HTMLElement>();
+    panelRef = createRef<HTMLDivElement>();
 
     addAction = new RecordAction({
         icon: Icon.add(),