From 89ad18e690ead199d3c627fcdfdb622df5dcbec7 Mon Sep 17 00:00:00 2001
From: Chloe Rice <chloe.rice@shopify.com>
Date: Wed, 22 May 2019 13:37:33 -0400
Subject: [PATCH] [Banner] Break word in title instead of overflowing line

---
 UNRELEASED.md                     | 1 +
 src/components/Banner/Banner.scss | 1 +
 2 files changed, 2 insertions(+)

diff --git a/UNRELEASED.md b/UNRELEASED.md
index 357f2578..14199a57 100644
--- a/UNRELEASED.md
+++ b/UNRELEASED.md
@@ -19,6 +19,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f
 ### Bug fixes
 
 - Fixed text and other elements from being selected in Safari when dragging the color picker ([#1562](https://github.com/Shopify/polaris-react/pull/1562))
+- Fixed `Banner` `title` overflowing when set to a single long word ([#1553](https://github.com/Shopify/polaris-react/pull/1553))
 
 ### Documentation
 
diff --git a/src/components/Banner/Banner.scss b/src/components/Banner/Banner.scss
index 7e7c377a..3c5f8ab8 100644
--- a/src/components/Banner/Banner.scss
+++ b/src/components/Banner/Banner.scss
@@ -142,6 +142,7 @@ $secondary-action-horizontal-padding: 1.5 * spacing(tight);
 
 .Heading {
   padding-top: $heading-offset;
+  word-break: break-word;
 }
 
 .Content {