Tag: Add "type=flow" that reflows to multiline with gaps.

This will be used in Publish Preview modal, and potentially be used in the "show all tags in Claim Preview" request.

ui/component/tag/view.jsx

@@ -25,6 +25,11 @@ export default function Tag(props: Props) {
     title = type === 'add' ? __('Add tag') : __('Remove tag');
   }
 
+  let iconRight = type !== 'link' && type !== 'large' && (type === 'remove' ? ICONS.REMOVE : ICONS.ADD);
+  if (type === 'flow') {
+    iconRight = null;
+  }
+
   return (
     <Button
       {...clickProps}
@@ -37,10 +42,11 @@ export default function Tag(props: Props) {
         // tag--add only adjusts the color, which causes issues with mature tag color clashing
         'tag--add': !isMature && type === 'add',
         'tag--mature': isMature,
+        'tag--flow': type === 'flow',
       })}
       label={name}
       iconSize={12}
-      iconRight={type !== 'link' && type !== 'large' && (type === 'remove' ? ICONS.REMOVE : ICONS.ADD)}
+      iconRight={iconRight}
     />
   );
 }

ui/scss/component/_tags.scss

@@ -68,3 +68,8 @@
 .tag--mature {
   @extend .badge--tag-mature;
 }
+
+.tag--flow {
+  margin: calc(2rem / 10) calc(2rem / 10);
+  max-width: 20rem;
+}