message: Preserve Tag selected styles on hover
diff: @@ -39,6 +39,18 @@ const tagStyles = ({ theme }) => css`
  display: inline-block;
  `;
  +const tagClickableStyles = ({ onClick, theme }) =>
  + onClick &&
  + css`
  + label: tag--clickable;
  + cursor: pointer;
  +
  + &:hover {
  + background-color: ${theme.colors.n300};
  + ${shadowBorder(theme.colors.n300)};
  + }
  + `;
  +
  const tagSelectedStyles = ({ selected, theme }) =>
  selected &&
  css`
  @@ -48,15 +60,13 @@ const tagSelectedStyles = ({ selected, theme }) =>
  color: ${theme.colors.white};
  `;
  -const tagClickableStyles = ({ onClick, theme }) =>
  +const tagSelectedClickableStyles = ({ selected, onClick, theme }) =>
  + selected &&
  onClick &&
  css`
  - label: tag--clickable;
  - cursor: pointer;
  -
  &:hover {
  - background-color: ${theme.colors.n300};
  - ${shadowBorder(theme.colors.n300)};
  + background-color: ${theme.colors.p500};
  + ${shadowBorder(theme.colors.p500)};
  }
  `;
  @@ -88,8 +98,9 @@ const IconContainer = styled('span')`
  `;
  const TagElement = styled('span')`
  ${tagStyles};
  - ${tagSelectedStyles};
  ${tagClickableStyles};
  + ${tagSelectedStyles};
  + ${tagSelectedClickableStyles};
  `;
  /**
  