diff --git a/common/changes/@itwin/appui-layout-react/widget-tab-tippy_2022-05-25-13-12.json b/common/changes/@itwin/appui-layout-react/widget-tab-tippy_2022-05-25-13-12.json
new file mode 100644
index 000000000000..c74da1d881a7
--- /dev/null
+++ b/common/changes/@itwin/appui-layout-react/widget-tab-tippy_2022-05-25-13-12.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@itwin/appui-layout-react",
+      "comment": "Allow tippy.js to close when tab is clicked.",
+      "type": "none"
+    }
+  ],
+  "packageName": "@itwin/appui-layout-react"
+}
\ No newline at end of file
diff --git a/ui/appui-layout-react/src/appui-layout-react/base/DragHandle.tsx b/ui/appui-layout-react/src/appui-layout-react/base/DragHandle.tsx
index 27b1835176ef..86ef3d5c3ead 100644
--- a/ui/appui-layout-react/src/appui-layout-react/base/DragHandle.tsx
+++ b/ui/appui-layout-react/src/appui-layout-react/base/DragHandle.tsx
@@ -66,7 +66,6 @@ export class DragHandle extends React.PureComponent<DragHandleProps, DragHandleS
 
     this.setState({ isPointerDown: true });
 
-    e.preventDefault();
     this._isDragged = false;
     this._initial = new Point(e.clientX, e.clientY);
   };
diff --git a/ui/appui-layout-react/src/appui-layout-react/base/PointerCaptor.tsx b/ui/appui-layout-react/src/appui-layout-react/base/PointerCaptor.tsx
index 5d8eb87ca67d..cdf5ecf82d62 100644
--- a/ui/appui-layout-react/src/appui-layout-react/base/PointerCaptor.tsx
+++ b/ui/appui-layout-react/src/appui-layout-react/base/PointerCaptor.tsx
@@ -55,7 +55,12 @@ export class PointerCaptor extends React.PureComponent<PointerCaptorProps> {
         style={this.props.style}
         role="presentation"
       >
-        <div className="nz-overlay" />
+        <div
+          className="nz-overlay"
+          onDragStart={(e)=> {
+            e.preventDefault();
+          }}
+        />
         {this.props.children}
       </div>
     );
diff --git a/ui/appui-layout-react/src/appui-layout-react/widget/rectangular/ResizeGrip.tsx b/ui/appui-layout-react/src/appui-layout-react/widget/rectangular/ResizeGrip.tsx
index b6df7351df59..69671ea275f3 100644
--- a/ui/appui-layout-react/src/appui-layout-react/widget/rectangular/ResizeGrip.tsx
+++ b/ui/appui-layout-react/src/appui-layout-react/widget/rectangular/ResizeGrip.tsx
@@ -137,7 +137,6 @@ export class ResizeGrip extends React.PureComponent<ResizeGripProps, ResizeGripS
     this._lastPosition = new Point(e.clientX, e.clientY);
 
     this._isResizing = true;
-    e.preventDefault();
 
     const bounds = Rectangle.create(grip.getBoundingClientRect());
     this.props.onResizeStart && this.props.onResizeStart({
diff --git a/ui/appui-layout-react/src/test/base/PointerCaptor.test.snap b/ui/appui-layout-react/src/test/base/PointerCaptor.test.snap
index f1af6f7ad002..7fb6add3d455 100644
--- a/ui/appui-layout-react/src/test/base/PointerCaptor.test.snap
+++ b/ui/appui-layout-react/src/test/base/PointerCaptor.test.snap
@@ -8,6 +8,7 @@ exports[`<PointerCaptor /> renders correctly 1`] = `
 >
   <div
     className="nz-overlay"
+    onDragStart={[Function]}
   />
 </div>
 `;
@@ -20,6 +21,7 @@ exports[`<PointerCaptor /> should respect isPointerDown prop over state 1`] = `
 >
   <div
     className="nz-overlay"
+    onDragStart={[Function]}
   />
 </div>
 `;
diff --git a/ui/appui-layout-react/src/test/base/PointerCaptor.test.tsx b/ui/appui-layout-react/src/test/base/PointerCaptor.test.tsx
index 144a0a87c897..f3fe6e7d3dc0 100644
--- a/ui/appui-layout-react/src/test/base/PointerCaptor.test.tsx
+++ b/ui/appui-layout-react/src/test/base/PointerCaptor.test.tsx
@@ -63,6 +63,18 @@ describe("<PointerCaptor />", () => {
 
     spy.calledOnce.should.true;
   });
+
+  it("should prevent default on drag start", () => {
+    const sut = mount(<PointerCaptor isPointerDown />);
+    const overlay = sut.find("div.nz-overlay");
+
+    const preventDefault = sinon.stub();
+    overlay.simulate("dragStart", {
+      preventDefault,
+    });
+
+    preventDefault.calledOnceWithExactly().should.true;
+  });
 });
 
 describe("usePointerCaptor", () => {
diff --git a/ui/appui-layout-react/src/test/widget/rectangular/tab/Tab.test.tsx b/ui/appui-layout-react/src/test/widget/rectangular/tab/Tab.test.tsx
index 2094f1a12bd0..f9b761ef231e 100644
--- a/ui/appui-layout-react/src/test/widget/rectangular/tab/Tab.test.tsx
+++ b/ui/appui-layout-react/src/test/widget/rectangular/tab/Tab.test.tsx
@@ -95,22 +95,6 @@ describe("<Tab />", () => {
     result.bottom.should.eq(0);
   });
 
-  it("should prevent default on pointer down", () => {
-    const sut = mount(<Tab
-      horizontalAnchor={HorizontalAnchor.Left}
-      mode={TabMode.Open}
-      verticalAnchor={VerticalAnchor.Middle}
-    />);
-    const pointerCaptor = sut.find(PointerCaptor);
-
-    const pointerDown = new PointerEvent("pointerdown");
-    const spy = sinon.spy(pointerDown, "preventDefault");
-
-    pointerCaptor.prop("onPointerDown")!(pointerDown);
-
-    spy.calledOnceWithExactly().should.true;
-  });
-
   it("should invoke onClick handler", () => {
     const spy = sinon.spy();
     const sut = mount(<Tab