[Banner] Break word in title instead of overflowing line

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
 

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 {