@sproutsocial/racine 7.0.0-beta.0 → 7.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/CHANGELOG.md +44 -0
  2. package/__flow__/Banner/index.stories.js +16 -0
  3. package/__flow__/Banner/styles.js +2 -0
  4. package/__flow__/Box/styles.js +5 -5
  5. package/__flow__/Button/__snapshots__/index.test.js.snap +0 -6
  6. package/__flow__/ChartLegend/styles.js +6 -6
  7. package/__flow__/Checkbox/index.js +2 -2
  8. package/__flow__/Checkbox/styles.js +3 -8
  9. package/__flow__/Collapsible/index.js +6 -1
  10. package/__flow__/EnumIconNames.js +1 -1
  11. package/__flow__/IconViewBoxes.js +1 -1
  12. package/__flow__/Link/styles.js +2 -1
  13. package/__flow__/Listbox/__snapshots__/index.test.js.snap +0 -2
  14. package/__flow__/Toast/index.js +5 -7
  15. package/__flow__/Toast/styles.js +6 -3
  16. package/__flow__/themes/dark.js +2 -2
  17. package/__flow__/utils/theme.js +3 -2
  18. package/commonjs/Banner/styles.js +1 -1
  19. package/commonjs/Checkbox/index.js +1 -1
  20. package/commonjs/Checkbox/styles.js +7 -7
  21. package/commonjs/Collapsible/index.js +11 -1
  22. package/commonjs/IconViewBoxes.js +3 -0
  23. package/commonjs/Link/styles.js +2 -2
  24. package/commonjs/Toast/index.js +5 -9
  25. package/commonjs/Toast/styles.js +11 -2
  26. package/commonjs/include-icons.js +1 -1
  27. package/commonjs/themes/dark.js +2 -2
  28. package/commonjs/utils/theme.js +4 -3
  29. package/dist/iconList.js +1 -1
  30. package/dist/icons.svg +1 -1
  31. package/icons/stories.svg +3 -0
  32. package/icons/yelp-full-star.svg +3 -0
  33. package/icons/yelp-half-star.svg +4 -0
  34. package/includeIcons.js +1 -1
  35. package/lib/Banner/styles.js +1 -1
  36. package/lib/Checkbox/index.js +2 -2
  37. package/lib/Checkbox/styles.js +5 -5
  38. package/lib/Collapsible/index.js +11 -1
  39. package/lib/IconViewBoxes.js +3 -0
  40. package/lib/Link/styles.js +3 -3
  41. package/lib/Toast/index.js +6 -11
  42. package/lib/Toast/styles.js +9 -2
  43. package/lib/include-icons.js +1 -1
  44. package/lib/themes/dark.js +2 -2
  45. package/lib/utils/theme.js +4 -3
  46. package/package.json +2 -2
  47. package/__flow__/.DS_Store +0 -0
  48. package/__flow__/@doug/index.stories.js +0 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,49 @@
1
1
  # Change Log
2
2
 
3
+ ## 7.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 145b487: Align icons within Banner components to the first line of the message, instead of centered
8
+
9
+ ## 7.0.0
10
+
11
+ ### Major Changes
12
+
13
+ - 052802b: This work includes adding semantic color tokens to our Racine theme and updating the Racine components to use the new tokens. Breaking changes include modifications to the the theme properties. Breaking changes include error -> error.color, warning -> warning.color, cta.primary -> cta.primary.color, cta.secondary -> cta.secondary.color, and cta.link -> cta.link.color
14
+
15
+ ## 6.25.2
16
+
17
+ ### Patch Changes
18
+
19
+ - 0a8ab22: fixes yelp addition in Theme.js
20
+ - 0a8ab22: Adds Yelp to theme.js file
21
+
22
+ ## 6.25.1
23
+
24
+ ### Patch Changes
25
+
26
+ - b0b1c60: delay triggering open of modal to run async and prevent render weirdness
27
+ - e97c613: Adds Yelp to theme.js file
28
+
29
+ ## 6.25.0
30
+
31
+ ### Minor Changes
32
+
33
+ - 38b94ac: Bump up seeds packet for Yelp token addition
34
+
35
+ ## 6.24.0
36
+
37
+ ### Minor Changes
38
+
39
+ - e5d8bcb: adds yelp star rating icon to seeds
40
+
41
+ ## 6.23.0
42
+
43
+ ### Minor Changes
44
+
45
+ - 49cb663: Add stories icon
46
+
3
47
  ## 6.22.3
4
48
 
5
49
  ### Patch Changes
package/__flow__/Banner/index.stories.js CHANGED
@@ -101,3 +101,19 @@ export const buttons = () => (
101
101
  buttons.story = {
102
102
  name: "With button",
103
103
  };
104
+
105
+ export const multiline = () => (
106
+ <Box width="300px">
107
+ <Banner
108
+ text={text(
109
+ "text",
110
+ "A very long opportunity message that is going to stretch to multiple lines, while the icon stays aligned with the first line."
111
+ )}
112
+ type="opportunity"
113
+ />
114
+ </Box>
115
+ );
116
+
117
+ multiline.story = {
118
+ name: "With multiline text",
119
+ };
package/__flow__/Banner/styles.js CHANGED
@@ -24,6 +24,8 @@ const Container: StyledComponent<TypeProps, TypeTheme, *> = styled.div(
24
24
  background-color: ${props.theme.colors[props.type].background};
25
25
 
26
26
  .Icon {
27
+ align-self: flex-start;
28
+ margin-top: 3px;
27
29
  margin-right: ${props.theme.space[400]};
28
30
  min-width: 16px;
29
31
  color: ${props.theme.colors[props.type].icon};
package/__flow__/Box/styles.js CHANGED
@@ -32,15 +32,15 @@ export type TypeContainerProps = $ReadOnly<{|
32
32
 
33
33
  type TypeBoxContainer = StyledComponent<TypeContainerProps, TypeTheme, *>;
34
34
  const Container: TypeBoxContainer = styled.div`
35
- box-sizing: border-box;
36
- font-family: ${({ theme }) => theme.fontFamily};
35
+ box-sizing: border-box;
36
+ font-family: ${({ theme }) => theme.fontFamily};
37
37
 
38
- ${COMMON}
39
- ${BORDER}
38
+ ${COMMON}
39
+ ${BORDER}
40
40
  ${LAYOUT}
41
41
  ${POSITION}
42
42
  ${FLEXBOX}
43
43
  ${GRID}
44
- `;
44
+ `;
45
45
 
46
46
  export default Container;
package/__flow__/Button/__snapshots__/index.test.js.snap CHANGED
@@ -105,7 +105,6 @@ exports[`Racine Button should render in an anchor tag with external target 1`] =
105
105
 
106
106
  .c0:hover {
107
107
  color: #273333;
108
- background: transparent;
109
108
  -webkit-text-decoration: none;
110
109
  text-decoration: none;
111
110
  box-shadow: none;
@@ -113,7 +112,6 @@ exports[`Racine Button should render in an anchor tag with external target 1`] =
113
112
 
114
113
  .c0:active {
115
114
  color: #273333;
116
- background: transparent;
117
115
  -webkit-transform: translateY(1px);
118
116
  -ms-transform: translateY(1px);
119
117
  transform: translateY(1px);
@@ -180,7 +178,6 @@ exports[`Racine Button should render in default style 1`] = `
180
178
 
181
179
  .c0:hover {
182
180
  color: #273333;
183
- background: transparent;
184
181
  -webkit-text-decoration: none;
185
182
  text-decoration: none;
186
183
  box-shadow: none;
@@ -188,7 +185,6 @@ exports[`Racine Button should render in default style 1`] = `
188
185
 
189
186
  .c0:active {
190
187
  color: #273333;
191
- background: transparent;
192
188
  -webkit-transform: translateY(1px);
193
189
  -ms-transform: translateY(1px);
194
190
  transform: translateY(1px);
@@ -326,7 +322,6 @@ exports[`Racine Button should render in pill style 1`] = `
326
322
 
327
323
  .c0:hover {
328
324
  color: #273333;
329
- background: transparent;
330
325
  -webkit-text-decoration: none;
331
326
  text-decoration: none;
332
327
  box-shadow: none;
@@ -334,7 +329,6 @@ exports[`Racine Button should render in pill style 1`] = `
334
329
 
335
330
  .c0:active {
336
331
  color: #273333;
337
- background: transparent;
338
332
  -webkit-transform: translateY(1px);
339
333
  -ms-transform: translateY(1px);
340
334
  transform: translateY(1px);
package/__flow__/ChartLegend/styles.js CHANGED
@@ -25,13 +25,13 @@ const Container: StyledComponent<any, TypeTheme, *> = styled.div`
25
25
  ${(props) =>
26
26
  props.inline &&
27
27
  css`
28
- display: flex;
29
- justify-content: center;
28
+ display: flex;
29
+ justify-content: center;
30
30
 
31
- ${Label} + ${Label} {
32
- margin-left: ${(props) => props.theme.space[450]};
33
- }
34
- `}
31
+ ${Label} + ${Label} {
32
+ margin-left: ${(props) => props.theme.space[450]};
33
+ }
34
+ `}
35
35
 
36
36
  ${COMMON}
37
37
  ${LAYOUT}
package/__flow__/Checkbox/index.js CHANGED
@@ -3,7 +3,7 @@ import * as React from "react";
3
3
  import Container, {
4
4
  CheckboxBox,
5
5
  CheckIcon,
6
- Input,
6
+ PillInput,
7
7
  InputWrapper,
8
8
  LabelText,
9
9
  CheckboxContainer,
@@ -108,7 +108,7 @@ export default class Checkbox extends React.Component<TypeProps> {
108
108
  // $FlowIssue - upgrade v0.112.0
109
109
  <Container as={label && "label"} {...rest}>
110
110
  <InputWrapper appearance={appearance}>
111
- <Input
111
+ <PillInput
112
112
  type="checkbox"
113
113
  id={id}
114
114
  aria-label={ariaLabel}
package/__flow__/Checkbox/styles.js CHANGED
@@ -41,7 +41,7 @@ export const InputWrapper = styled<typeof Box, TypeTheme, any>(Box)`
41
41
  background-color: ${props.theme.colors.background.app};
42
42
  }
43
43
 
44
- ${Input} {
44
+ ${PillInput} {
45
45
  ${pill}
46
46
  }
47
47
  `}
@@ -89,7 +89,7 @@ export const CheckIcon = styled<typeof Icon, TypeTheme>(Icon)`
89
89
 
90
90
  CheckIcon.displayName = "CheckIcon";
91
91
 
92
- export const Input: StyledComponent<any, TypeTheme, *> = styled.input`
92
+ export const PillInput: StyledComponent<any, TypeTheme, *> = styled.input`
93
93
  position: absolute;
94
94
  top: 0;
95
95
  left: 0;
@@ -114,11 +114,6 @@ export const Input: StyledComponent<any, TypeTheme, *> = styled.input`
114
114
  css`
115
115
  &:hover,
116
116
  &:focus {
117
- ~ ${CheckboxBox} {
118
- border-color: ${props.theme.colors.forms.hoverBorderColor};
119
- background-color: ${props.theme.colors.background.container};
120
- }
121
-
122
117
  ~ ${CheckboxBox} ${CheckIcon} {
123
118
  opacity: ${(props) => (props.disabled ? 0 : 1)};
124
119
  color: ${props.theme.colors.forms.borderColor};
@@ -151,7 +146,7 @@ export const Input: StyledComponent<any, TypeTheme, *> = styled.input`
151
146
  `}
152
147
  `;
153
148
 
154
- Input.displayName = "Input";
149
+ PillInput.displayName = "PillInput";
155
150
 
156
151
  export const LabelText = styled<typeof Text, TypeTheme, any>(Text)`
157
152
  margin-left: ${(props) => props.theme.space[300]};
package/__flow__/Collapsible/index.js CHANGED
@@ -65,7 +65,12 @@ const Panel = ({ children, ...rest }) => {
65
65
  const timeoutID = setTimeout(() => setIsHidden(!isOpen), 300);
66
66
  return () => clearTimeout(timeoutID);
67
67
  } else {
68
- setIsHidden(!isOpen);
68
+ // Similar to the close animation, we need to delay setting hidden to run slightly async.
69
+ // An issue occurs with the initial render isHidden logic that causes the animation to occur sporadically.
70
+ // using this 0 second timeout just allows this component to initially render with an undefined max height,
71
+ // Then go directly from undefined to the full max height, without a brief 0 value that triggers an animation
72
+ const timeoutID = setTimeout(() => setIsHidden(!isOpen), 0);
73
+ return () => clearTimeout(timeoutID);
69
74
  }
70
75
  }, [isOpen]);
71
76
 
package/__flow__/EnumIconNames.js CHANGED
@@ -1,2 +1,2 @@
1
1
  // @flow
2
- export type EnumIconNames = "active-listener" | "add-item" | "add-keyword" | "add-team-member" | "address-card-solid" | "adobe-experience-manager" | "ads" | "android" | "apple" | "approval-indicator-outline" | "approval-indicator" | "archive" | "arrow-down-line" | "arrow-down" | "arrow-left-line" | "arrow-left" | "arrow-right-line" | "arrow-right" | "arrow-up-line" | "arrow-up" | "arrows" | "asset-library-outline" | "asset-library" | "assign" | "atom" | "audio" | "back-to-top" | "bambu-icon-outline" | "bambu-icon" | "barcode" | "basketball" | "bell-outline" | "bitly" | "bold" | "book" | "bot" | "browser" | "business" | "calendar-outline" | "calendar" | "camera-outline" | "camera-story" | "camera" | "campaign" | "canva" | "carousel" | "cart-plus-outline" | "cart-plus" | "check" | "chevron-down-filled" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up-down-filled" | "chevron-up-filled" | "chevron-up" | "circle-check-outline" | "circle-check" | "circle" | "circle+" | "circles" | "circlex" | "click-to-view" | "clicks" | "clipboard-outline" | "clipboard" | "clock" | "closed-captioning" | "cloud" | "code" | "columns" | "comment-alt-outline" | "comment-alt" | "comment-lines-alt-outline" | "comment" | "compact-density" | "compact-indicator" | "comparison" | "competitor" | "compose" | "content-suggestions" | "credit-card" | "crop" | "crown" | "dashboard" | "discovery" | "dislike-outline" | "dislike" | "dm-link-outline" | "dm-link" | "dotdotdot" | "download" | "drafts-outline" | "drafts" | "dropbox" | "duplicate-outline" | "duplicate" | "emoji-outline" | "emoji" | "empty-image" | "engagement-per-post" | "engagements" | "error" | "exchange-alt" | "expanded-indicator" | "export" | "extended-circles" | "external-link-alt" | "external-link" | "extreme-negative-sentiment" | "eye-outline" | "eye-slash-outline" | "eye-slash" | "eye" | "facebook-audience-network" | "facebook-branded-content-outline" | "facebook-branded-content" | "facebook-groups" | "facebook" | "fb-reactions-angry" | "fb-reactions-haha" | "fb-reactions-like" | "fb-reactions-love" | "fb-reactions-sad" | "fb-reactions-wow" | "feedly" | "feeds" | "female" | "file-chart-line" | "file-edit" | "file-times-solid" | "filter" | "flag-outline" | "flag" | "folder-open" | "folder" | "follow-outline" | "follow" | "follower-increase" | "following" | "font" | "full-access" | "gear" | "gears" | "glassdoor" | "glasses" | "globe" | "google-analytics-color" | "google-business-messages" | "google-drive" | "google-my-business" | "grip" | "h1" | "h2" | "hamburger" | "hashtag" | "headset" | "heart-outline" | "heart" | "heartbeat" | "help" | "hiking" | "history" | "home" | "hourglass" | "hubspot" | "image-caption" | "image" | "images" | "impressions-per-post" | "impressions" | "inactive-listener" | "inbox-action" | "inbox-views" | "inbox" | "indicator" | "industry" | "info" | "instagram" | "internal-activity-outline" | "internal-activity" | "italic" | "key" | "keyboard" | "laptop-phone" | "large-density" | "lift" | "like-outline" | "like" | "link" | "linkedin-audience-network" | "linkedin" | "list-ol" | "listening" | "lists" | "location-outline" | "location" | "lock" | "male" | "marketo" | "mention" | "message-preview-outline" | "message-preview" | "message" | "messages-outline" | "messages" | "messenger" | "metric-table" | "microsoft-dynamics" | "minus" | "mobile" | "monitor" | "moon" | "negative-sentiment" | "neutral-positive-sentiment" | "neutral-sentiment" | "new-trend" | "newspaper" | "no-access" | "notepad" | "notifications-publishing-outline" | "notifications-publishing" | "notifications" | "offline" | "online" | "paid-promotion-outline" | "paid-promotion" | "paid" | "paint" | "palette" | "paperclip" | "pause" | "pencil-outline" | "pencil" | "person" | "phone" | "pinterest-boards-outline" | "pinterest-boards" | "pinterest" | "play-circle" | "play" | "plus" | "positive-sentiment" | "power-up" | "profile-connect" | "profile-disconnect" | "publishing-outline" | "publishing" | "puzzle-piece" | "qr-code" | "queue" | "recommendation" | "reddit-alien" | "reddit" | "referrals" | "refresh" | "rejected" | "reply-outline" | "reply" | "reporting-period" | "reporting" | "reports-home" | "reports" | "retweet" | "rss" | "sales" | "salesforce" | "save-assets" | "saved-messages" | "saved-reply-outline" | "saved-reply" | "search" | "sent-message-outline" | "sent-message" | "share" | "shopify" | "show-navigation" | "slack" | "small-density" | "smiley" | "some-access" | "sparkles" | "spike-alert" | "star-half-alt-solid" | "star-of-life" | "star-outline" | "star" | "sticky-note-outline" | "sticky-note" | "story" | "suggestions" | "sun" | "tag-outline" | "tag" | "targeting-outline" | "targeting" | "tasks-outline" | "tasks" | "team-conversation-outline" | "team-conversation" | "team" | "text-asset" | "text" | "times" | "trash-can-outline" | "trash-can" | "trend-down" | "trend-neutral" | "trend-up" | "trends" | "triangle-black" | "triangle" | "tripadvisor-circle-outline" | "tripadvisor-circle" | "tripadvisor" | "trophy-outline" | "tumblr" | "twitter-audience-network" | "twitter" | "unfollow-outline" | "unfollow" | "unlink" | "unlock" | "user-circle" | "users" | "verified" | "video-camera-story" | "video-camera" | "vip" | "weight" | "window-maximize" | "window-minimize" | "window-regular" | "window-restore" | "x" | "yelp" | "youtube" | "zendesk";
2
+ export type EnumIconNames = "active-listener" | "add-item" | "add-keyword" | "add-team-member" | "address-card-solid" | "adobe-experience-manager" | "ads" | "android" | "apple" | "approval-indicator-outline" | "approval-indicator" | "archive" | "arrow-down-line" | "arrow-down" | "arrow-left-line" | "arrow-left" | "arrow-right-line" | "arrow-right" | "arrow-up-line" | "arrow-up" | "arrows" | "asset-library-outline" | "asset-library" | "assign" | "atom" | "audio" | "back-to-top" | "bambu-icon-outline" | "bambu-icon" | "barcode" | "basketball" | "bell-outline" | "bitly" | "bold" | "book" | "bot" | "browser" | "business" | "calendar-outline" | "calendar" | "camera-outline" | "camera-story" | "camera" | "campaign" | "canva" | "carousel" | "cart-plus-outline" | "cart-plus" | "check" | "chevron-down-filled" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up-down-filled" | "chevron-up-filled" | "chevron-up" | "circle-check-outline" | "circle-check" | "circle" | "circle+" | "circles" | "circlex" | "click-to-view" | "clicks" | "clipboard-outline" | "clipboard" | "clock" | "closed-captioning" | "cloud" | "code" | "columns" | "comment-alt-outline" | "comment-alt" | "comment-lines-alt-outline" | "comment" | "compact-density" | "compact-indicator" | "comparison" | "competitor" | "compose" | "content-suggestions" | "credit-card" | "crop" | "crown" | "dashboard" | "discovery" | "dislike-outline" | "dislike" | "dm-link-outline" | "dm-link" | "dotdotdot" | "download" | "drafts-outline" | "drafts" | "dropbox" | "duplicate-outline" | "duplicate" | "emoji-outline" | "emoji" | "empty-image" | "engagement-per-post" | "engagements" | "error" | "exchange-alt" | "expanded-indicator" | "export" | "extended-circles" | "external-link-alt" | "external-link" | "extreme-negative-sentiment" | "eye-outline" | "eye-slash-outline" | "eye-slash" | "eye" | "facebook-audience-network" | "facebook-branded-content-outline" | "facebook-branded-content" | "facebook-groups" | "facebook" | "fb-reactions-angry" | "fb-reactions-haha" | "fb-reactions-like" | "fb-reactions-love" | "fb-reactions-sad" | "fb-reactions-wow" | "feedly" | "feeds" | "female" | "file-chart-line" | "file-edit" | "file-times-solid" | "filter" | "flag-outline" | "flag" | "folder-open" | "folder" | "follow-outline" | "follow" | "follower-increase" | "following" | "font" | "full-access" | "gear" | "gears" | "glassdoor" | "glasses" | "globe" | "google-analytics-color" | "google-business-messages" | "google-drive" | "google-my-business" | "grip" | "h1" | "h2" | "hamburger" | "hashtag" | "headset" | "heart-outline" | "heart" | "heartbeat" | "help" | "hiking" | "history" | "home" | "hourglass" | "hubspot" | "image-caption" | "image" | "images" | "impressions-per-post" | "impressions" | "inactive-listener" | "inbox-action" | "inbox-views" | "inbox" | "indicator" | "industry" | "info" | "instagram" | "internal-activity-outline" | "internal-activity" | "italic" | "key" | "keyboard" | "laptop-phone" | "large-density" | "lift" | "like-outline" | "like" | "link" | "linkedin-audience-network" | "linkedin" | "list-ol" | "listening" | "lists" | "location-outline" | "location" | "lock" | "male" | "marketo" | "mention" | "message-preview-outline" | "message-preview" | "message" | "messages-outline" | "messages" | "messenger" | "metric-table" | "microsoft-dynamics" | "minus" | "mobile" | "monitor" | "moon" | "negative-sentiment" | "neutral-positive-sentiment" | "neutral-sentiment" | "new-trend" | "newspaper" | "no-access" | "notepad" | "notifications-publishing-outline" | "notifications-publishing" | "notifications" | "offline" | "online" | "paid-promotion-outline" | "paid-promotion" | "paid" | "paint" | "palette" | "paperclip" | "pause" | "pencil-outline" | "pencil" | "person" | "phone" | "pinterest-boards-outline" | "pinterest-boards" | "pinterest" | "play-circle" | "play" | "plus" | "positive-sentiment" | "power-up" | "profile-connect" | "profile-disconnect" | "publishing-outline" | "publishing" | "puzzle-piece" | "qr-code" | "queue" | "recommendation" | "reddit-alien" | "reddit" | "referrals" | "refresh" | "rejected" | "reply-outline" | "reply" | "reporting-period" | "reporting" | "reports-home" | "reports" | "retweet" | "rss" | "sales" | "salesforce" | "save-assets" | "saved-messages" | "saved-reply-outline" | "saved-reply" | "search" | "sent-message-outline" | "sent-message" | "share" | "shopify" | "show-navigation" | "slack" | "small-density" | "smiley" | "some-access" | "sparkles" | "spike-alert" | "star-half-alt-solid" | "star-of-life" | "star-outline" | "star" | "sticky-note-outline" | "sticky-note" | "stories" | "story" | "suggestions" | "sun" | "tag-outline" | "tag" | "targeting-outline" | "targeting" | "tasks-outline" | "tasks" | "team-conversation-outline" | "team-conversation" | "team" | "text-asset" | "text" | "times" | "trash-can-outline" | "trash-can" | "trend-down" | "trend-neutral" | "trend-up" | "trends" | "triangle-black" | "triangle" | "tripadvisor-circle-outline" | "tripadvisor-circle" | "tripadvisor" | "trophy-outline" | "tumblr" | "twitter-audience-network" | "twitter" | "unfollow-outline" | "unfollow" | "unlink" | "unlock" | "user-circle" | "users" | "verified" | "video-camera-story" | "video-camera" | "vip" | "weight" | "window-maximize" | "window-minimize" | "window-regular" | "window-restore" | "x" | "yelp-full-star" | "yelp-half-star" | "yelp" | "youtube" | "zendesk";
package/__flow__/IconViewBoxes.js CHANGED
@@ -1 +1 @@
1
- module.exports = {"active-listener":"0 0 16 16","add-item":"0 0 16 16","add-keyword":"0 0 16 16","add-team-member":"0 0 18 13","address-card-solid":"0 0 18 16","adobe-experience-manager":"0 0 16 18","ads":"0 0 9 16","android":"0 0 14 16","apple":"0 0 14 16","approval-indicator-outline":"0 0 14 16","approval-indicator":"0 0 14 16","archive":"0 0 16 16","arrow-down-line":"0 0 14 16","arrow-down":"0 0 16 16","arrow-left-line":"0 0 16 18","arrow-left":"0 0 16 16","arrow-right-line":"0 0 16 18","arrow-right":"0 0 16 16","arrow-up-line":"0 0 14 16","arrow-up":"0 0 16 16","arrows":"0 0 16 16","asset-library-outline":"0 0 16 16","asset-library":"0 0 16 16","assign":"0 0 18 15","atom":"0 0 14 16","audio":"0 0 16 14","back-to-top":"0 0 15 16","bambu-icon-outline":"0 0 16 16","bambu-icon":"0 0 16 16","barcode":"0 0 18 16","basketball":"0 0 16 16","bell-outline":"0 0 14 16","bitly":"0 0 16 16","bold":"0 0 16 16","book":"0 0 14 16","bot":"0 0 16 16","browser":"0 0 16 16","business":"0 0 16 16","calendar-outline":"0 0 14 16","calendar":"0 0 14 16","camera-outline":"0 0 18 16","camera-story":"0 0 18 16","camera":"0 0 18 16","campaign":"0 0 16 14","canva":"0 0 16 18","carousel":"0 0 16 18","cart-plus-outline":"0 0 17 15","cart-plus":"0 0 17 15","check":"0 0 16 16","chevron-down-filled":"0 0 16 21","chevron-down":"0 0 16 18","chevron-left":"0 0 10 16","chevron-right":"0 0 10 17","chevron-up-down-filled":"0 0 12 20","chevron-up-filled":"0 0 16 21","chevron-up":"0 0 16 18","circle-check-outline":"0 0 16 16","circle-check":"0 0 16 16","circle":"0 0 16 16","circle+":"0 0 16 16","circles":"0 0 16 16","circlex":"0 0 16 16","click-to-view":"0 0 12 16","clicks":"0 0 10 16","clipboard-outline":"0 0 12 16","clipboard":"0 0 12 16","clock":"0 0 16 16","closed-captioning":"0 0 16 16","cloud":"0 0 16 13","code":"0 0 18 16","columns":"0 0 16 16","comment-alt-outline":"0 0 16 15","comment-alt":"0 0 16 15","comment-lines-alt-outline":"0 0 16 16","comment":"0 0 16 13","compact-density":"0 0 16 16","compact-indicator":"0 0 16 16","comparison":"0 0 16 14","competitor":"0 0 14 16","compose":"0 0 16 16","content-suggestions":"0 0 16 16","credit-card":"0 0 16 14","crop":"0 0 16 16","crown":"0 0 16 16","dashboard":"0 0 16 14","discovery":"0 0 16 16","dislike-outline":"0 0 15 16","dislike":"0 0 16 16","dm-link-outline":"0 0 16 16","dm-link":"0 0 16 16","dotdotdot":"0 0 16 16","download":"0 0 16 16","drafts-outline":"0 0 12 16","drafts":"0 0 12 16","dropbox":"0 0 18 16","duplicate-outline":"0 0 14 16","duplicate":"0 0 14 16","emoji-outline":"0 0 16 16","emoji":"0 0 16 16","empty-image":"0 0 16 18","engagement-per-post":"0 0 16 16","engagements":"0 0 16 15","error":"0 0 16 16","exchange-alt":"0 0 16 16","expanded-indicator":"0 0 16 16","export":"0 0 14 17","extended-circles":"0 0 16 16","external-link-alt":"0 0 16 16","external-link":"0 0 16 16","extreme-negative-sentiment":"0 0 16 16","eye-outline":"0 0 18 16","eye-slash-outline":"0 0 20 16","eye-slash":"0 0 20 16","eye":"0 0 18 16","facebook-audience-network":"0 0 16 16","facebook-branded-content-outline":"0 0 18 15","facebook-branded-content":"0 0 18 15","facebook-groups":"0 0 16 16","facebook":"0 0 16 16","fb-reactions-angry":"0 0 16 16","fb-reactions-haha":"0 0 16 16","fb-reactions-like":"0 0 16 16","fb-reactions-love":"0 0 16 16","fb-reactions-sad":"0 0 16 16","fb-reactions-wow":"0 0 16 16","feedly":"0 0 16 15","feeds":"0 0 16 15","female":"0 0 11 18","file-chart-line":"0 0 12 16","file-edit":"0 0 12 16","file-times-solid":"0 0 12 16","filter":"0 0 16 16","flag-outline":"0 0 16 16","flag":"0 0 16 16","folder-open":"0 0 16 15","folder":"0 0 16 16","follow-outline":"0 0 20 16","follow":"0 0 20 16","follower-increase":"0 0 19 16","following":"0 0 20 16","font":"0 0 18 16","full-access":"0 0 16 16","gear":"0 0 16 16","gears":"0 0 16 16","glassdoor":"0 0 16 16","glasses":"0 0 18 14","globe":"0 0 16 16","google-analytics-color":"0 0 14 18","google-business-messages":"0 0 16 16","google-drive":"0 0 16 14","google-my-business":"0 0 16 14","grip":"0 0 8 18","h1":"0 0 16 16","h2":"0 0 16 16","hamburger":"0 0 16 18","hashtag":"0 0 16 16","headset":"0 0 16 16","heart-outline":"0 0 16 16","heart":"0 0 16 16","heartbeat":"0 0 18 16","help":"0 0 16 16","hiking":"0 0 16 16","history":"0 0 16 16","home":"0 0 16 15","hourglass":"0 0 12 16","hubspot":"0 0 16 16","image-caption":"0 0 16 14","image":"0 0 16 16","images":"0 0 16 15","impressions-per-post":"0 0 16 16","impressions":"0 0 18 16","inactive-listener":"0 0 16 12","inbox-action":"0 0 16 16","inbox-views":"0 0 16 13","inbox":"0 0 16 14","indicator":"0 0 16 16","industry":"0 0 14 16","info":"0 0 16 16","instagram":"0 0 16 16","internal-activity-outline":"0 0 16 16","internal-activity":"0 0 16 16","italic":"0 0 16 16","key":"0 0 16 16","keyboard":"0 0 18 16","laptop-phone":"0 0 16 16","large-density":"0 0 16 16","lift":"0 0 23 16","like-outline":"0 0 15 16","like":"0 0 16 16","link":"0 0 16 16","linkedin-audience-network":"0 0 16 16","linkedin":"0 0 16 16","list-ol":"0 0 16 16","listening":"0 0 14 16","lists":"0 0 16 16","location-outline":"0 0 12 16","location":"0 0 12 16","lock":"0 0 14 16","male":"0 0 16 20","marketo":"0 0 18 20","mention":"0 0 16 16","message-preview-outline":"0 0 18 16","message-preview":"0 0 18 16","message":"0 0 16 16","messages-outline":"0 0 16 16","messages":"0 0 16 16","messenger":"0 0 16 16","metric-table":"0 0 16 16","microsoft-dynamics":"0 0 16 16","minus":"0 0 16 16","mobile":"0 0 10 16","monitor":"0 0 12 16","moon":"0 0 15 16","negative-sentiment":"0 0 16 16","neutral-positive-sentiment":"0 0 16 16","neutral-sentiment":"0 0 16 16","new-trend":"0 0 12 16","newspaper":"0 0 16 16","no-access":"0 0 16 16","notepad":"0 0 12 16","notifications-publishing-outline":"0 0 16 16","notifications-publishing":"0 0 16 16","notifications":"0 0 14 16","offline":"0 0 18 15","online":"0 0 18 15","paid-promotion-outline":"0 0 16 16","paid-promotion":"0 0 16 16","paid":"0 0 14 16","paint":"0 0 18 16","palette":"0 0 16 16","paperclip":"0 0 14 16","pause":"0 0 16 18","pencil-outline":"0 0 16 16","pencil":"0 0 16 16","person":"0 0 14 16","phone":"0 0 16 16","pinterest-boards-outline":"0 0 14 16","pinterest-boards":"0 0 14 16","pinterest":"0 0 16 16","play-circle":"0 0 16 16","play":"0 0 14 16","plus":"0 0 16 18","positive-sentiment":"0 0 16 16","power-up":"0 0 10 16","profile-connect":"0 0 16 16","profile-disconnect":"0 0 16 16","publishing-outline":"0 0 16 16","publishing":"0 0 16 16","puzzle-piece":"0 0 18 16","qr-code":"0 0 16 16","queue":"0 0 16 16","recommendation":"0 0 16 16","reddit-alien":"0 0 16 16","reddit":"0 0 16 16","referrals":"0 0 16 16","refresh":"0 0 16 16","rejected":"0 0 16 16","reply-outline":"0 0 16 16","reply":"0 0 16 16","reporting-period":"0 0 14 16","reporting":"0 0 16 16","reports-home":"0 0 16 16","reports":"0 0 16 15","retweet":"0 0 18 16","rss":"0 0 16 16","sales":"0 0 9 16","salesforce":"0 0 20 16","save-assets":"0 0 16 16","saved-messages":"0 0 16 16","saved-reply-outline":"0 0 16 12","saved-reply":"0 0 16 12","search":"0 0 16 16","sent-message-outline":"0 0 16 14","sent-message":"0 0 16 14","share":"0 0 16 14","shopify":"0 0 16 18","slack":"0 0 16 16","small-density":"0 0 16 16","smiley":"0 0 16 16","some-access":"0 0 16 16","sparkles":"0 0 16 16","spike-alert":"0 0 16 16","star-half-alt-solid":"0 0 18 16","star-of-life":"0 0 16 16","star-outline":"0 0 18 16","star":"0 0 18 16","sticky-note-outline":"0 0 16 16","sticky-note":"0 0 16 16","story":"0 0 16 16","suggestions":"0 0 11 16","sun":"0 0 16 16","tag-outline":"0 0 16 16","tag":"0 0 16 16","targeting-outline":"0 0 16 16","targeting":"0 0 16 16","tasks-outline":"0 0 12 16","tasks":"0 0 12 16","team-conversation-outline":"0 0 16 18","team-conversation":"0 0 16 18","team":"0 0 18 16","text-asset":"0 0 16 16","text":"0 0 8 16","times":"0 0 16 22","trash-can-outline":"0 0 14 16","trash-can":"0 0 14 16","trend-down":"0 0 18 18","trend-neutral":"0 0 20 18","trend-up":"0 0 18 18","trends":"0 0 16 17","triangle-black":"0 0 16 16","triangle":"0 0 16 16","tripadvisor-circle-outline":"0 0 16 16","tripadvisor-circle":"0 0 16 16","tripadvisor":"0 0 16 16","trophy-outline":"0 0 18 16","tumblr":"0 0 16 16","twitter-audience-network":"0 0 17 16","twitter":"0 0 17 16","unfollow-outline":"0 0 20 16","unfollow":"0 0 20 16","unlink":"0 0 16 16","unlock":"0 0 14 16","user-circle":"0 0 16 16","users":"0 0 18 16","verified":"0 0 16 16","video-camera-story":"0 0 18 15","video-camera":"0 0 18 16","vip":"0 0 16 16","weight":"0 0 16 16","window-maximize":"0 0 16 16","window-minimize":"0 0 16 16","window-regular":"0 0 16 16","window-restore":"0 0 16 16","x":"0 0 16 18","yelp":"0 0 14 16","youtube":"0 0 16 15","zendesk":"0 0 16 16"};
1
+ module.exports = {"active-listener":"0 0 16 16","add-item":"0 0 16 16","add-keyword":"0 0 16 16","add-team-member":"0 0 18 13","address-card-solid":"0 0 18 16","adobe-experience-manager":"0 0 16 18","ads":"0 0 9 16","android":"0 0 14 16","apple":"0 0 14 16","approval-indicator-outline":"0 0 14 16","approval-indicator":"0 0 14 16","archive":"0 0 16 16","arrow-down-line":"0 0 14 16","arrow-down":"0 0 16 16","arrow-left-line":"0 0 16 18","arrow-left":"0 0 16 16","arrow-right-line":"0 0 16 18","arrow-right":"0 0 16 16","arrow-up-line":"0 0 14 16","arrow-up":"0 0 16 16","arrows":"0 0 16 16","asset-library-outline":"0 0 16 16","asset-library":"0 0 16 16","assign":"0 0 18 15","atom":"0 0 14 16","audio":"0 0 16 14","back-to-top":"0 0 15 16","bambu-icon-outline":"0 0 16 16","bambu-icon":"0 0 16 16","barcode":"0 0 18 16","basketball":"0 0 16 16","bell-outline":"0 0 14 16","bitly":"0 0 16 16","bold":"0 0 16 16","book":"0 0 14 16","bot":"0 0 16 16","browser":"0 0 16 16","business":"0 0 16 16","calendar-outline":"0 0 14 16","calendar":"0 0 14 16","camera-outline":"0 0 18 16","camera-story":"0 0 18 16","camera":"0 0 18 16","campaign":"0 0 16 14","canva":"0 0 16 18","carousel":"0 0 16 18","cart-plus-outline":"0 0 17 15","cart-plus":"0 0 17 15","check":"0 0 16 16","chevron-down-filled":"0 0 16 21","chevron-down":"0 0 16 18","chevron-left":"0 0 10 16","chevron-right":"0 0 10 17","chevron-up-down-filled":"0 0 12 20","chevron-up-filled":"0 0 16 21","chevron-up":"0 0 16 18","circle-check-outline":"0 0 16 16","circle-check":"0 0 16 16","circle":"0 0 16 16","circle+":"0 0 16 16","circles":"0 0 16 16","circlex":"0 0 16 16","click-to-view":"0 0 12 16","clicks":"0 0 10 16","clipboard-outline":"0 0 12 16","clipboard":"0 0 12 16","clock":"0 0 16 16","closed-captioning":"0 0 16 16","cloud":"0 0 16 13","code":"0 0 18 16","columns":"0 0 16 16","comment-alt-outline":"0 0 16 15","comment-alt":"0 0 16 15","comment-lines-alt-outline":"0 0 16 16","comment":"0 0 16 13","compact-density":"0 0 16 16","compact-indicator":"0 0 16 16","comparison":"0 0 16 14","competitor":"0 0 14 16","compose":"0 0 16 16","content-suggestions":"0 0 16 16","credit-card":"0 0 16 14","crop":"0 0 16 16","crown":"0 0 16 16","dashboard":"0 0 16 14","discovery":"0 0 16 16","dislike-outline":"0 0 15 16","dislike":"0 0 16 16","dm-link-outline":"0 0 16 16","dm-link":"0 0 16 16","dotdotdot":"0 0 16 16","download":"0 0 16 16","drafts-outline":"0 0 12 16","drafts":"0 0 12 16","dropbox":"0 0 18 16","duplicate-outline":"0 0 14 16","duplicate":"0 0 14 16","emoji-outline":"0 0 16 16","emoji":"0 0 16 16","empty-image":"0 0 16 18","engagement-per-post":"0 0 16 16","engagements":"0 0 16 15","error":"0 0 16 16","exchange-alt":"0 0 16 16","expanded-indicator":"0 0 16 16","export":"0 0 14 17","extended-circles":"0 0 16 16","external-link-alt":"0 0 16 16","external-link":"0 0 16 16","extreme-negative-sentiment":"0 0 16 16","eye-outline":"0 0 18 16","eye-slash-outline":"0 0 20 16","eye-slash":"0 0 20 16","eye":"0 0 18 16","facebook-audience-network":"0 0 16 16","facebook-branded-content-outline":"0 0 18 15","facebook-branded-content":"0 0 18 15","facebook-groups":"0 0 16 16","facebook":"0 0 16 16","fb-reactions-angry":"0 0 16 16","fb-reactions-haha":"0 0 16 16","fb-reactions-like":"0 0 16 16","fb-reactions-love":"0 0 16 16","fb-reactions-sad":"0 0 16 16","fb-reactions-wow":"0 0 16 16","feedly":"0 0 16 15","feeds":"0 0 16 15","female":"0 0 11 18","file-chart-line":"0 0 12 16","file-edit":"0 0 12 16","file-times-solid":"0 0 12 16","filter":"0 0 16 16","flag-outline":"0 0 16 16","flag":"0 0 16 16","folder-open":"0 0 16 15","folder":"0 0 16 16","follow-outline":"0 0 20 16","follow":"0 0 20 16","follower-increase":"0 0 19 16","following":"0 0 20 16","font":"0 0 18 16","full-access":"0 0 16 16","gear":"0 0 16 16","gears":"0 0 16 16","glassdoor":"0 0 16 16","glasses":"0 0 18 14","globe":"0 0 16 16","google-analytics-color":"0 0 14 18","google-business-messages":"0 0 16 16","google-drive":"0 0 16 14","google-my-business":"0 0 16 14","grip":"0 0 8 18","h1":"0 0 16 16","h2":"0 0 16 16","hamburger":"0 0 16 18","hashtag":"0 0 16 16","headset":"0 0 16 16","heart-outline":"0 0 16 16","heart":"0 0 16 16","heartbeat":"0 0 18 16","help":"0 0 16 16","hiking":"0 0 16 16","history":"0 0 16 16","home":"0 0 16 15","hourglass":"0 0 12 16","hubspot":"0 0 16 16","image-caption":"0 0 16 14","image":"0 0 16 16","images":"0 0 16 15","impressions-per-post":"0 0 16 16","impressions":"0 0 18 16","inactive-listener":"0 0 16 12","inbox-action":"0 0 16 16","inbox-views":"0 0 16 13","inbox":"0 0 16 14","indicator":"0 0 16 16","industry":"0 0 14 16","info":"0 0 16 16","instagram":"0 0 16 16","internal-activity-outline":"0 0 16 16","internal-activity":"0 0 16 16","italic":"0 0 16 16","key":"0 0 16 16","keyboard":"0 0 18 16","laptop-phone":"0 0 16 16","large-density":"0 0 16 16","lift":"0 0 23 16","like-outline":"0 0 15 16","like":"0 0 16 16","link":"0 0 16 16","linkedin-audience-network":"0 0 16 16","linkedin":"0 0 16 16","list-ol":"0 0 16 16","listening":"0 0 14 16","lists":"0 0 16 16","location-outline":"0 0 12 16","location":"0 0 12 16","lock":"0 0 14 16","male":"0 0 16 20","marketo":"0 0 18 20","mention":"0 0 16 16","message-preview-outline":"0 0 18 16","message-preview":"0 0 18 16","message":"0 0 16 16","messages-outline":"0 0 16 16","messages":"0 0 16 16","messenger":"0 0 16 16","metric-table":"0 0 16 16","microsoft-dynamics":"0 0 16 16","minus":"0 0 16 16","mobile":"0 0 10 16","monitor":"0 0 12 16","moon":"0 0 15 16","negative-sentiment":"0 0 16 16","neutral-positive-sentiment":"0 0 16 16","neutral-sentiment":"0 0 16 16","new-trend":"0 0 12 16","newspaper":"0 0 16 16","no-access":"0 0 16 16","notepad":"0 0 12 16","notifications-publishing-outline":"0 0 16 16","notifications-publishing":"0 0 16 16","notifications":"0 0 14 16","offline":"0 0 18 15","online":"0 0 18 15","paid-promotion-outline":"0 0 16 16","paid-promotion":"0 0 16 16","paid":"0 0 14 16","paint":"0 0 18 16","palette":"0 0 16 16","paperclip":"0 0 14 16","pause":"0 0 16 18","pencil-outline":"0 0 16 16","pencil":"0 0 16 16","person":"0 0 14 16","phone":"0 0 16 16","pinterest-boards-outline":"0 0 14 16","pinterest-boards":"0 0 14 16","pinterest":"0 0 16 16","play-circle":"0 0 16 16","play":"0 0 14 16","plus":"0 0 16 18","positive-sentiment":"0 0 16 16","power-up":"0 0 10 16","profile-connect":"0 0 16 16","profile-disconnect":"0 0 16 16","publishing-outline":"0 0 16 16","publishing":"0 0 16 16","puzzle-piece":"0 0 18 16","qr-code":"0 0 16 16","queue":"0 0 16 16","recommendation":"0 0 16 16","reddit-alien":"0 0 16 16","reddit":"0 0 16 16","referrals":"0 0 16 16","refresh":"0 0 16 16","rejected":"0 0 16 16","reply-outline":"0 0 16 16","reply":"0 0 16 16","reporting-period":"0 0 14 16","reporting":"0 0 16 16","reports-home":"0 0 16 16","reports":"0 0 16 15","retweet":"0 0 18 16","rss":"0 0 16 16","sales":"0 0 9 16","salesforce":"0 0 20 16","save-assets":"0 0 16 16","saved-messages":"0 0 16 16","saved-reply-outline":"0 0 16 12","saved-reply":"0 0 16 12","search":"0 0 16 16","sent-message-outline":"0 0 16 14","sent-message":"0 0 16 14","share":"0 0 16 14","shopify":"0 0 16 18","slack":"0 0 16 16","small-density":"0 0 16 16","smiley":"0 0 16 16","some-access":"0 0 16 16","sparkles":"0 0 16 16","spike-alert":"0 0 16 16","star-half-alt-solid":"0 0 18 16","star-of-life":"0 0 16 16","star-outline":"0 0 18 16","star":"0 0 18 16","sticky-note-outline":"0 0 16 16","sticky-note":"0 0 16 16","stories":"0 0 16 17","story":"0 0 16 16","suggestions":"0 0 11 16","sun":"0 0 16 16","tag-outline":"0 0 16 16","tag":"0 0 16 16","targeting-outline":"0 0 16 16","targeting":"0 0 16 16","tasks-outline":"0 0 12 16","tasks":"0 0 12 16","team-conversation-outline":"0 0 16 18","team-conversation":"0 0 16 18","team":"0 0 18 16","text-asset":"0 0 16 16","text":"0 0 8 16","times":"0 0 16 22","trash-can-outline":"0 0 14 16","trash-can":"0 0 14 16","trend-down":"0 0 18 18","trend-neutral":"0 0 20 18","trend-up":"0 0 18 18","trends":"0 0 16 17","triangle-black":"0 0 16 16","triangle":"0 0 16 16","tripadvisor-circle-outline":"0 0 16 16","tripadvisor-circle":"0 0 16 16","tripadvisor":"0 0 16 16","trophy-outline":"0 0 18 16","tumblr":"0 0 16 16","twitter-audience-network":"0 0 17 16","twitter":"0 0 17 16","unfollow-outline":"0 0 20 16","unfollow":"0 0 20 16","unlink":"0 0 16 16","unlock":"0 0 14 16","user-circle":"0 0 16 16","users":"0 0 18 16","verified":"0 0 16 16","video-camera-story":"0 0 18 15","video-camera":"0 0 18 16","vip":"0 0 16 16","weight":"0 0 16 16","window-maximize":"0 0 16 16","window-minimize":"0 0 16 16","window-regular":"0 0 16 16","window-restore":"0 0 16 16","x":"0 0 16 18","yelp-full-star":"0 0 16 16","yelp-half-star":"0 0 16 16","yelp":"0 0 14 16","youtube":"0 0 16 15","zendesk":"0 0 16 16"};
package/__flow__/Link/styles.js CHANGED
@@ -2,7 +2,7 @@
2
2
  import styled, { css } from "styled-components";
3
3
  import { focusRing, disabled } from "../utils/mixins";
4
4
  import Text from "../Text";
5
- import { TYPOGRAPHY } from "../utils/system-props";
5
+ import { TYPOGRAPHY, COMMON } from "../utils/system-props";
6
6
 
7
7
  import type { TypeTheme } from "../types/theme.flow";
8
8
 
@@ -48,6 +48,7 @@ const Container = styled<typeof Text, TypeTheme, any>(Text)`
48
48
 
49
49
  ${(props) => props.disabled && disabled}
50
50
 
51
+ ${COMMON}
51
52
  ${TYPOGRAPHY}
52
53
  `;
53
54
 
package/__flow__/Listbox/__snapshots__/index.test.js.snap CHANGED
@@ -59,7 +59,6 @@ html .c5 {
59
59
 
60
60
  .c1:hover {
61
61
  color: #273333;
62
- background: transparent;
63
62
  -webkit-text-decoration: none;
64
63
  text-decoration: none;
65
64
  box-shadow: none;
@@ -67,7 +66,6 @@ html .c5 {
67
66
 
68
67
  .c1:active {
69
68
  color: #273333;
70
- background: transparent;
71
69
  -webkit-transform: translateY(1px);
72
70
  -ms-transform: translateY(1px);
73
71
  transform: translateY(1px);
package/__flow__/Toast/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  // @flow
2
2
  import * as React from "react";
3
- import Container, { GlobalToastStyles } from "./styles";
3
+ import Container, { GlobalToastStyles, CustomIcon } from "./styles";
4
4
  import {
5
5
  toast as toastifyToast,
6
6
  ToastContainer as BaseToastContainer,
@@ -115,14 +115,12 @@ const Toast = ({ content, theme, color, icon }: TypeProps) => {
115
115
  width={1}
116
116
  >
117
117
  <IconBox>
118
- <Icon
119
- name={theme ? themeIcon[theme] : icon || themeIcon["info"]}
118
+ <CustomIcon
119
+ type={theme || "info"}
120
120
  color={color}
121
- mr={400}
121
+ customColor={color}
122
+ name={theme ? themeIcon[theme] : icon || themeIcon["info"]}
122
123
  fixedWidth
123
- css={`
124
- transform: translateY(4px);
125
- `}
126
124
  />
127
125
  </IconBox>
128
126
 
package/__flow__/Toast/styles.js CHANGED
@@ -1,6 +1,7 @@
1
1
  //@flow
2
2
  import styled, { createGlobalStyle } from "styled-components";
3
3
  import Box from "../Box";
4
+ import Icon from "../Icon";
4
5
  // $FlowIssue
5
6
  import toastStyles from "!!raw-loader!react-toastify/dist/ReactToastify.css";
6
7
 
@@ -19,10 +20,12 @@ const Container = styled<typeof Box, TypeTheme, TypeProps>(Box)`
19
20
  position: relative;
20
21
  background: ${(p) => p.theme.colors.background.container};
21
22
  border-left: 2px solid ${(p) => p.theme.colors[p.type].border};
23
+ `;
22
24
 
23
- .Icon {
24
- color: ${(p) => (p.customColor ? undefined : p.theme.colors[p.type].icon)};
25
- }
25
+ export const CustomIcon = styled<typeof Icon, TypeTheme, TypeProps>(Icon)`
26
+ margin-right: ${(props) => props.theme.space[400]};
27
+ transform: translateY(4px);
28
+ color: ${(p) => (p.customColor ? undefined : p.theme.colors[p.type].icon)};
26
29
  `;
27
30
 
28
31
  export const GlobalToastStyles = createGlobalStyle`
package/__flow__/themes/dark.js CHANGED
@@ -21,8 +21,8 @@ const darkTheme = {
21
21
  color: COLORS.COLOR_NEUTRAL_100,
22
22
  background: "transparent",
23
23
  hoverColor: COLORS.COLOR_NEUTRAL_0,
24
- hoverBackground: "transparent",
25
- activeBackground: "transparent",
24
+ hoverBackground: undefined,
25
+ activeBackground: undefined,
26
26
  borderColor: "transparent",
27
27
  },
28
28
  primary: {
package/__flow__/utils/theme.js CHANGED
@@ -25,8 +25,8 @@ const colors = {
25
25
  color: COLORS.COLOR_NEUTRAL_700,
26
26
  background: "transparent",
27
27
  hoverColor: COLORS.COLOR_NEUTRAL_900,
28
- hoverBackground: "transparent",
29
- activeBackground: "transparent",
28
+ hoverBackground: undefined,
29
+ activeBackground: undefined,
30
30
  borderColor: "transparent",
31
31
  },
32
32
  primary: {
@@ -309,6 +309,7 @@ const colors = {
309
309
  zendesk: NETWORKCOLORS.NETWORK_COLOR_ZENDESK,
310
310
  hubspot: NETWORKCOLORS.NETWORK_COLOR_HUBSPOT,
311
311
  microsoft_dynamics: NETWORKCOLORS.NETWORK_COLOR_MICROSOFT_DYNAMICS,
312
+ yelp: NETWORKCOLORS.NETWORK_COLOR_YELP,
312
313
  },
313
314
  };
314
315
 
package/commonjs/Banner/styles.js CHANGED
@@ -15,7 +15,7 @@ var Container = _styledComponents.default.div.withConfig({
15
15
  displayName: "styles__Container",
16
16
  componentId: "q43dr4-0"
17
17
  })(function (props) {
18
- return (0, _styledComponents.css)(["display:flex;overflow:hidden;align-items:center;justify-content:space-between;color:", ";border-radius:", ";font-family:", ";", " padding:", ";border:1px solid ", ";background-color:", ";.Icon{margin-right:", ";min-width:16px;color:", ";}a,button{font-weight:", ";color:", ";font-size:inherit;text-decoration:underline;}> span:not(.Icon){display:block;}", " ", ""], props.theme.colors.text.headline, props.theme.radii.outer, props.theme.fontFamily, props.theme.typography[200], props.theme.space[300], props.theme.colors[props.type].border, props.theme.colors[props.type].background, props.theme.space[400], props.theme.colors[props.type].icon, props.theme.fontWeights.semibold, props.theme.colors.text.headline, _systemProps.COMMON, _systemProps.LAYOUT);
18
+ return (0, _styledComponents.css)(["display:flex;overflow:hidden;align-items:center;justify-content:space-between;color:", ";border-radius:", ";font-family:", ";", " padding:", ";border:1px solid ", ";background-color:", ";.Icon{align-self:flex-start;margin-top:3px;margin-right:", ";min-width:16px;color:", ";}a,button{font-weight:", ";color:", ";font-size:inherit;text-decoration:underline;}> span:not(.Icon){display:block;}", " ", ""], props.theme.colors.text.headline, props.theme.radii.outer, props.theme.fontFamily, props.theme.typography[200], props.theme.space[300], props.theme.colors[props.type].border, props.theme.colors[props.type].background, props.theme.space[400], props.theme.colors[props.type].icon, props.theme.fontWeights.semibold, props.theme.colors.text.headline, _systemProps.COMMON, _systemProps.LAYOUT);
19
19
  });
20
20
 
21
21
  var _default = Container;
package/commonjs/Checkbox/index.js CHANGED
@@ -110,7 +110,7 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
110
110
  as: label && "label"
111
111
  }, rest), /*#__PURE__*/React.createElement(_styles.InputWrapper, {
112
112
  appearance: appearance
113
- }, /*#__PURE__*/React.createElement(_styles.Input, _extends({
113
+ }, /*#__PURE__*/React.createElement(_styles.PillInput, _extends({
114
114
  type: "checkbox",
115
115
  id: id,
116
116
  "aria-label": ariaLabel,
package/commonjs/Checkbox/styles.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
 
3
3
  exports.__esModule = true;
4
- exports.default = exports.CheckboxContainer = exports.LabelText = exports.Input = exports.CheckIcon = exports.CheckboxBox = exports.InputWrapper = void 0;
4
+ exports.default = exports.CheckboxContainer = exports.LabelText = exports.PillInput = exports.CheckIcon = exports.CheckboxBox = exports.InputWrapper = void 0;
5
5
 
6
6
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
7
7
 
@@ -40,7 +40,7 @@ var InputWrapper = (0, _styledComponents.default)(_Box.default).withConfig({
40
40
  return props.theme.duration.fast;
41
41
  }, function (props) {
42
42
  return props.theme.easing.ease_inout;
43
- }, _mixins.pill, props.theme.colors.background.app, Input, _mixins.pill);
43
+ }, _mixins.pill, props.theme.colors.background.app, PillInput, _mixins.pill);
44
44
  });
45
45
  exports.InputWrapper = InputWrapper;
46
46
  InputWrapper.displayName = "InputWrapper";
@@ -79,13 +79,13 @@ var CheckIcon = (0, _styledComponents.default)(_Icon.default).withConfig({
79
79
  exports.CheckIcon = CheckIcon;
80
80
  CheckIcon.displayName = "CheckIcon";
81
81
 
82
- var Input = _styledComponents.default.input.withConfig({
83
- displayName: "styles__Input",
82
+ var PillInput = _styledComponents.default.input.withConfig({
83
+ displayName: "styles__PillInput",
84
84
  componentId: "sc-59uw8o-4"
85
85
  })(["position:absolute;top:0;left:0;width:100%;height:100%;margin:0;appearance:none;cursor:", ";border-radius:4px;&::-ms-check{display:none;}&:focus{", "}", " ", " ", ""], function (props) {
86
86
  return props.disabled ? "not-allowed" : "pointer";
87
87
  }, _mixins.focusRing, function (props) {
88
- return !props.checked && (0, _styledComponents.css)(["&:hover,&:focus{~ ", "{border-color:", ";background-color:", ";}~ ", " ", "{opacity:", ";color:", ";}}"], CheckboxBox, props.theme.colors.forms.hoverBorderColor, props.theme.colors.background.container, CheckboxBox, CheckIcon, function (props) {
88
+ return !props.checked && (0, _styledComponents.css)(["&:hover,&:focus{~ ", " ", "{opacity:", ";color:", ";}}"], CheckboxBox, CheckIcon, function (props) {
89
89
  return props.disabled ? 0 : 1;
90
90
  }, props.theme.colors.forms.borderColor);
91
91
  }, function (props) {
@@ -94,8 +94,8 @@ var Input = _styledComponents.default.input.withConfig({
94
94
  return props.disabled && (0, _styledComponents.css)(["~ ", "{opacity:0.4;}~ ", " ", "{opacity:", ";}"], CheckboxBox, CheckboxBox, CheckIcon, props.checked ? 1 : 0);
95
95
  });
96
96
 
97
- exports.Input = Input;
98
- Input.displayName = "Input";
97
+ exports.PillInput = PillInput;
98
+ PillInput.displayName = "PillInput";
99
99
  var LabelText = (0, _styledComponents.default)(_Text.default).withConfig({
100
100
  displayName: "styles__LabelText",
101
101
  componentId: "sc-59uw8o-5"
package/commonjs/Collapsible/index.js CHANGED
@@ -89,7 +89,17 @@ var Panel = function Panel(_ref3) {
89
89
  return clearTimeout(timeoutID);
90
90
  };
91
91
  } else {
92
- setIsHidden(!isOpen);
92
+ // Similar to the close animation, we need to delay setting hidden to run slightly async.
93
+ // An issue occurs with the initial render isHidden logic that causes the animation to occur sporadically.
94
+ // using this 0 second timeout just allows this component to initially render with an undefined max height,
95
+ // Then go directly from undefined to the full max height, without a brief 0 value that triggers an animation
96
+ var _timeoutID = setTimeout(function () {
97
+ return setIsHidden(!isOpen);
98
+ }, 0);
99
+
100
+ return function () {
101
+ return clearTimeout(_timeoutID);
102
+ };
93
103
  }
94
104
  }, [isOpen]);
95
105
  return /*#__PURE__*/React.createElement(_styles.CollapsingBox, _extends({
package/commonjs/IconViewBoxes.js CHANGED
@@ -289,6 +289,7 @@ module.exports = {
289
289
  "star": "0 0 18 16",
290
290
  "sticky-note-outline": "0 0 16 16",
291
291
  "sticky-note": "0 0 16 16",
292
+ "stories": "0 0 16 17",
292
293
  "story": "0 0 16 16",
293
294
  "suggestions": "0 0 11 16",
294
295
  "sun": "0 0 16 16",
@@ -335,6 +336,8 @@ module.exports = {
335
336
  "window-regular": "0 0 16 16",
336
337
  "window-restore": "0 0 16 16",
337
338
  "x": "0 0 16 18",
339
+ "yelp-full-star": "0 0 16 16",
340
+ "yelp-half-star": "0 0 16 16",
338
341
  "yelp": "0 0 14 16",
339
342
  "youtube": "0 0 16 15",
340
343
  "zendesk": "0 0 16 16"
package/commonjs/Link/styles.js CHANGED
@@ -20,7 +20,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
20
20
  var Container = (0, _styledComponents.default)(_Text.default).withConfig({
21
21
  displayName: "styles__Container",
22
22
  componentId: "adcw4a-0"
23
- })(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:none;appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", ""], function (props) {
23
+ })(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:none;appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ""], function (props) {
24
24
  return props.theme.fontFamily;
25
25
  }, function (props) {
26
26
  return props.theme.duration.fast;
@@ -40,6 +40,6 @@ var Container = (0, _styledComponents.default)(_Text.default).withConfig({
40
40
  return !props.href && (0, _styledComponents.css)(["background:none;"]);
41
41
  }, function (props) {
42
42
  return props.disabled && _mixins.disabled;
43
- }, _systemProps.TYPOGRAPHY);
43
+ }, _systemProps.COMMON, _systemProps.TYPOGRAPHY);
44
44
  var _default = Container;
45
45
  exports.default = _default;
package/commonjs/Toast/index.js CHANGED
@@ -97,14 +97,9 @@ var IconBox = function IconBox(props) {
97
97
  }));
98
98
  };
99
99
 
100
- var _StyledIcon = (0, _styledComponents.default)(_Icon.default).withConfig({
101
- displayName: "Toast___StyledIcon",
102
- componentId: "sc-1vii3dq-1"
103
- })(["transform:translateY(4px);"]);
104
-
105
100
  var _StyledBox2 = (0, _styledComponents.default)(_Box.default).withConfig({
106
101
  displayName: "Toast___StyledBox2",
107
- componentId: "sc-1vii3dq-2"
102
+ componentId: "sc-1vii3dq-1"
108
103
  })(["transform:translateY(1px);"]);
109
104
 
110
105
  var Toast = function Toast(_ref) {
@@ -125,10 +120,11 @@ var Toast = function Toast(_ref) {
125
120
  alignItems: "flex-start",
126
121
  m: "auto",
127
122
  width: 1
128
- }, /*#__PURE__*/React.createElement(IconBox, null, /*#__PURE__*/React.createElement(_StyledIcon, {
129
- name: theme ? themeIcon[theme] : icon || themeIcon["info"],
123
+ }, /*#__PURE__*/React.createElement(IconBox, null, /*#__PURE__*/React.createElement(_styles.CustomIcon, {
124
+ type: theme || "info",
130
125
  color: color,
131
- mr: 400,
126
+ customColor: color,
127
+ name: theme ? themeIcon[theme] : icon || themeIcon["info"],
132
128
  fixedWidth: true
133
129
  })), /*#__PURE__*/React.createElement(_StyledBox2, {
134
130
  flex: 1