diff --git a/packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/DualListSelectorTreeDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/DualListSelectorTreeDemo.tsx
index 048b0444f26..88fc018b9be 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/DualListSelectorTreeDemo.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/DualListSelectorTreeDemo.tsx
@@ -1,33 +1,38 @@
 import React from 'react';
-import { DualListSelector, DualListSelectorProps } from '@patternfly/react-core';
+import { DualListSelector, DualListSelectorProps, DualListSelectorTreeItemData } from '@patternfly/react-core';
 interface DualListSelectorState {
-  availableOptions: React.ReactNode[];
-  chosenOptions: React.ReactNode[];
+  availableOptions: DualListSelectorTreeItemData[];
+  chosenOptions: DualListSelectorTreeItemData[];
 }
 
 export class DualListSelectorTreeDemo extends React.Component<DualListSelectorProps, DualListSelectorState> {
   static displayName = 'DualListSelectorTreeDemo';
-  onListChange: (newAvailableOptions: React.ReactNode[], newChosenOptions: React.ReactNode[]) => void;
+  onListChange: (
+    newAvailableOptions: DualListSelectorTreeItemData[],
+    newChosenOptions: DualListSelectorTreeItemData[]
+  ) => void;
 
   constructor(props: DualListSelectorProps) {
     super(props);
     this.state = {
       availableOptions: [
-        { id: 'F1', text: 'Folder 1', children: [{ id: 'O1', text: 'Option 1' }] },
-        { id: 'O2', text: 'Option 2' },
+        { id: 'F1', text: 'Folder 1', isChecked: false, children: [{ id: 'O1', text: 'Option 1', isChecked: false }] },
+        { id: 'O2', text: 'Option 2', isChecked: false },
         {
           id: 'F2',
           text: 'Folder 2',
+          isChecked: false,
           children: [
             {
               id: 'F3',
               text: 'Folder 3',
+              isChecked: false,
               children: [
-                { id: 'O3', text: 'Option 3' },
-                { id: 'O4', text: 'Option 4' }
+                { id: 'O3', text: 'Option 3', isChecked: false },
+                { id: 'O4', text: 'Option 4', isChecked: false }
               ]
             },
-            { id: 'O5', text: 'Option 5' }
+            { id: 'O5', text: 'Option 5', isChecked: false }
           ]
         }
       ],
@@ -48,7 +53,7 @@ export class DualListSelectorTreeDemo extends React.Component<DualListSelectorPr
         isSearchable
         availableOptions={this.state.availableOptions}
         chosenOptions={this.state.chosenOptions}
-        onListChange={this.onListChange}
+        onListChange={this.onListChange as any}
         isTree
       />
     );
diff --git a/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/DefaultGroup.tsx b/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/DefaultGroup.tsx
index 1e3830f2df8..b85976b4745 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/DefaultGroup.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/DefaultGroup.tsx
@@ -14,6 +14,7 @@ import {
 } from '@patternfly/react-topology';
 
 type GroupProps = {
+  children?: React.ReactNode;
   element: Node;
   droppable?: boolean;
   hover?: boolean;
diff --git a/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/GroupHull.tsx b/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/GroupHull.tsx
index 9488b7f3977..062549058f0 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/GroupHull.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/TopologyDemo/components/GroupHull.tsx
@@ -20,6 +20,7 @@ import {
 } from '@patternfly/react-topology';
 
 type GroupHullProps = {
+  children?: React.ReactNode;
   element: Node;
   droppable?: boolean;
   hover?: boolean;