@sproutsocial/racine 15.1.0 → 17.0.0

package/CHANGELOG.md

@@ -1,5 +1,84 @@
 # Change Log
 
+## 17.0.0
+
+### Major Changes
+
+- 5234f32d: Accessibility updates to Card based on Perkins review.
+
+  **Breaking changes**
+
+  - Card using role='link' will no longer work without the `CardLink` subcomponent
+
+  **Enhancements**
+
+  - Cards with `role='link'` should now wrap link text in the `CardLink` subcomponent
+  - Improves screen reader accessiblity by pairing Cards as links with the new `CardLink` subcomponent
+  - Adds `CardLink` subcomponent
+    - Link text wrapped in CardLink renders an anchor tag as a child of Card
+    - Preserves the behavior that allows the user to click the whole Card as the link
+    - Handles navigating to the href using default link behavior.
+    - Includes an `affordance` prop that makes composing a Card as a link easy and visually appealing
+
+### Minor Changes
+
+- 99b984a6: Add the following Partner Logos:
+  - android
+  - apple
+  - github
+  - github-alien
+  - salesforce-cloud
+- 6c2753bc: Adds Tableau symbol and lockup to the `PartnerLogo` component
+
+### Patch Changes
+
+- b31737fa: Fixed automation for `PartnerLogo` names and type, which updated `PartnerLogoNames` and `EnumLogoNames` so they now include all logos.
+
+  **Deprecation Warning**:
+
+  - `PartnerNames` is now deprecated in favor of `PartnerLogoNames`
+  - `TypePartnerNames` is now deprecated in favor of `EnumLogoNames`
+
+- fb536bed: Applies `box-sizing: content-box` property to Switch loading state in order to avoid conflicts with global CSS reset properties
+- adec46fc: Updates Toast to accept Partner Logo names for 'icon' prop
+  - Toast erroneously did not accept Partner Logo names for the 'icon' prop, even after the Icon component was updated to render PartnerLogos.
+  - The Flow and Typescript types have been updated to add all partner names to the valid values for the 'icon' prop.
+
+## 16.0.0
+
+### Major Changes
+
+- 94469294: Accessibility and api changes for the `Switch` component:
+  - **Breaking Change:** `a11yLabels` prop has been removed in favor of using `aria-label` or `aria-labeledby`
+  - New `loading` prop has been added for intermediate states for asynchronous Switch behavior
+  - Slight style changes and css improvements for parity with Figma library components
+
+### Minor Changes
+
+- 273671d1: Add `custom-post-variables` svg to the SpotIllustrations component
+- b44a5e38: Adds screen reader announcements for DatePicker visible month changes
+  - A visually hidden element describing which months are visible is now rendered for all DatePickers.
+  - This provides feedback to screen reader users when they click the previous month or next month buttons.
+- 16b303d3: Add `typeIconProps` to `Banner` to allow aria props to be passed to the type `Icon`
+- b44a5e38: Adds setStatusText prop to DatePicker components
+  - A setStatusText prop is now available for all DatePickers. It is optional but strongly recommended for accessibility purposes.
+  - setStatusText receives an array of the currently visible month(s) as Moment objects.
+  - setStatusText should return a localized string that describes the currently visible months, such as "Now showing June 2023" or "May 2023 and June 2023, now showing".
+- af63482c: Table Headers now recieve scope and colgroup attributes to announce grouped columns to screen readers
+- ee36f147: Sortable table headers can now be wrapped in a button and are more accessible to screen readers
+- 8d5fb2c0: Adds a new `badgeColors` object that represents the available badge colors. It also adds a new `TypeBadgeColor` type that is a union of the color options in the `badgeColors` object. Both can be imported from the `@sproutsocial/racine` package.
+- 90b7a542: Changes aria-haspopup to "dialog" rather than "true" since it is a dialog rather than a menu.
+- 303af7c0: TabButton now supports the following props by default:
+
+  - `role="tab"`
+  - `aria-selected={isSelected}`
+
+  The Tabs component now has `role="tablist"` by default.
+
+### Patch Changes
+
+- 894597e3: Adds `quote-solid` icon
+
 ## 15.1.0
 
 ### Minor Changes

package/__flow__/Badge/Badge.flow.js

@@ -1,13 +1,15 @@
 // @flow
 import * as React from 'react';
 import type { TypeIconName } from "../Icon/index.flow";
+import { badgeColors } from "./constants.flow";
+export type TypeBadgeColor = $Keys<typeof badgeColors>;
 export type TypeBadgeProps = {
   children?: React.Node,
   /** DEPRECATED: Use children instead of text */
   text?: React.Node,
   /** Size default is deprecated in favor of small and large */
   size?: 'small' | 'large' | 'default',
-  badgeColor?: 'green' | 'blue' | 'purple' | 'yellow' | 'orange' | 'red' | 'neutral' | 'magenta' | 'pink' | 'aqua' | 'teal',
+  badgeColor?: TypeBadgeColor,
   iconName?: TypeIconName,
   /** DEPRECATED: Possibly only used for testing. Refrain from using at all if possible. (optional) */
   tip?: React.Node,

package/__flow__/Badge/constants.flow.js

@@ -12,4 +12,17 @@ declare export var legacyBadgeColors: {|
   approval: TypeLegacyBadgeColor,
   default: TypeLegacyBadgeColor,
   suggestion: TypeLegacyBadgeColor,
-|};
+|};
+export const badgeColors = Object.freeze({
+  green: 'green',
+  blue: 'blue',
+  purple: 'purple',
+  yellow: 'yellow',
+  orange: 'orange',
+  red: 'red',
+  neutral: 'neutral',
+  magenta: 'magenta',
+  pink: 'pink',
+  aqua: 'aqua',
+  teal: 'teal'
+});

package/__flow__/Banner/Banner.flow.js

@@ -1,5 +1,6 @@
 // @flow
 import * as React from 'react';
+import type { TypeIconProps } from "../Icon/index.flow";
 export type EnumBannerType = 'success' | 'info' | 'error' | 'warning' | 'opportunity';
 export type TypeBannerProps = {
   text: React.Node,
@@ -9,6 +10,12 @@ export type TypeBannerProps = {
   onClose?: () => void,
   /** Close icon aria label */
   closeButtonLabel?: string,
+  /** Icon props that can be passed to the Type specific Icon */
+  typeIconProps?: {
+    ...TypeIconProps,
+    name?: void,
+    ...
+  },
   ...
 };
 declare var Banner: React.StatelessFunctionalComponent<TypeBannerProps>;

package/__flow__/DatePicker/DateRangePicker/DateRangePicker.flow.js

@@ -11,6 +11,7 @@ export type TypeDateRangePickerProps = {
   |}) => void,
   focusedInput: EnumFocusedInput,
   onFocusChange: (EnumFocusedInput) => void,
+  setStatusText?: (moment$Moment[]) => string,
   ...TypeCommonDatePickerProps,
   ...
 };

package/__flow__/DatePicker/SingleDatePicker/SingleDatePicker.flow.js

@@ -4,6 +4,7 @@ import { type TypeCommonDatePickerProps } from "../common.flow";
 export type TypeSingleDatePickerProps = {
   date: ?moment$Moment,
   onDateChange: (date: moment$Moment) => void,
+  setStatusText?: (date: moment$Moment) => string,
   focused?: boolean,
   onFocusChange?: ({
     focused: boolean,

package/__flow__/EnumIconNames.flow.js

@@ -1,2 +1,2 @@
 // @flow
-export type EnumIconNames = "active-listener" | "add-item" | "add-keyword" | "add-team-member" | "add-variable" | "address-card-outline" | "address-card-solid" | "adobe-experience-manager" | "ads" | "advocacy-outline" | "advocacy" | "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" | "bigcommerce" | "bitly" | "bold" | "book" | "bookmark" | "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-ai-outline" | "comment-ai" | "comment-alt-outline" | "comment-alt" | "comment-lines-alt-outline" | "comment" | "compact-density" | "compact-indicator" | "comparison" | "competitor" | "compose" | "content-suggestions" | "credit-card" | "crop" | "crown" | "dashboard" | "deconstructed-negative-sentiment" | "deconstructed-neutral-sentiment" | "deconstructed-positive-sentiment" | "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" | "flat-negative-sentiment-outline" | "flat-negative-sentiment" | "flat-neutral-sentiment-outline" | "flat-neutral-sentiment" | "flat-positive-sentiment-outline" | "flat-positive-sentiment" | "folder-open" | "folder" | "follow-outline" | "follow" | "follower-increase" | "following" | "font" | "full-access" | "gear" | "gears" | "github" | "glassdoor" | "glasses" | "globe" | "google-analytics-color" | "google-business-messages" | "google-drive" | "google-my-business" | "grip" | "h1" | "h2" | "h3" | "h4" | "hamburger" | "hand-sparkle-outline" | "hand-sparkle" | "hashtag" | "headset" | "heart-outline" | "heart" | "heartbeat" | "help-alt" | "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" | "magic-wand" | "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" | "plug" | "plus" | "positive-sentiment" | "power-up-outline" | "power-up" | "profile-connect" | "profile-disconnect" | "publishing-outline" | "publishing" | "puzzle-piece" | "qr-code" | "queue" | "recommendation" | "reddit-alien" | "reddit" | "reels-outline" | "reels" | "referrals" | "refresh" | "rejected" | "reply-outline" | "reply" | "reporting-period" | "reporting" | "reports-home" | "reports" | "retweet" | "route" | "rss" | "sales" | "salesforce-cloud" | "salesforce" | "save-assets" | "saved-messages" | "saved-reply-outline" | "saved-reply" | "search" | "send-again-outline" | "send-again" | "sent-message-outline" | "sent-message" | "share" | "shopify" | "shopping-bag-outline" | "shopping-bag" | "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-check" | "tasks-outline" | "tasks" | "team-conversation-outline" | "team-conversation" | "team-sprout-outline" | "team-sprout" | "team" | "text-asset" | "text" | "tiktok" | "times" | "tools" | "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" | "underline" | "unfollow-outline" | "unfollow" | "unlink" | "unlock" | "upload" | "user-circle" | "users" | "verified" | "video-camera-story" | "video-camera" | "vip" | "weight" | "whatsapp" | "window-maximize" | "window-minimize" | "window-regular" | "window-restore" | "woocommerce" | "x" | "yelp-full-star" | "yelp-half-star" | "yelp" | "youtube" | "zendesk";
+export type EnumIconNames = "active-listener" | "add-item" | "add-keyword" | "add-team-member" | "add-variable" | "address-card-outline" | "address-card-solid" | "adobe-experience-manager" | "ads" | "advocacy-outline" | "advocacy" | "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" | "bigcommerce" | "bitly" | "bold" | "book" | "bookmark" | "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-ai-outline" | "comment-ai" | "comment-alt-outline" | "comment-alt" | "comment-lines-alt-outline" | "comment" | "compact-density" | "compact-indicator" | "comparison" | "competitor" | "compose" | "content-suggestions" | "credit-card" | "crop" | "crown" | "dashboard" | "deconstructed-negative-sentiment" | "deconstructed-neutral-sentiment" | "deconstructed-positive-sentiment" | "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" | "flat-negative-sentiment-outline" | "flat-negative-sentiment" | "flat-neutral-sentiment-outline" | "flat-neutral-sentiment" | "flat-positive-sentiment-outline" | "flat-positive-sentiment" | "folder-open" | "folder" | "follow-outline" | "follow" | "follower-increase" | "following" | "font" | "full-access" | "gear" | "gears" | "github" | "glassdoor" | "glasses" | "globe" | "google-analytics-color" | "google-business-messages" | "google-drive" | "google-my-business" | "grip" | "h1" | "h2" | "h3" | "h4" | "hamburger" | "hand-sparkle-outline" | "hand-sparkle" | "hashtag" | "headset" | "heart-outline" | "heart" | "heartbeat" | "help-alt" | "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" | "magic-wand" | "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" | "plug" | "plus" | "positive-sentiment" | "power-up-outline" | "power-up" | "profile-connect" | "profile-disconnect" | "publishing-outline" | "publishing" | "puzzle-piece" | "qr-code" | "queue" | "quotes-solid" | "recommendation" | "reddit-alien" | "reddit" | "reels-outline" | "reels" | "referrals" | "refresh" | "rejected" | "reply-outline" | "reply" | "reporting-period" | "reporting" | "reports-home" | "reports" | "retweet" | "route" | "rss" | "sales" | "salesforce-cloud" | "salesforce" | "save-assets" | "saved-messages" | "saved-reply-outline" | "saved-reply" | "search" | "send-again-outline" | "send-again" | "sent-message-outline" | "sent-message" | "share" | "shopify" | "shopping-bag-outline" | "shopping-bag" | "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-check" | "tasks-outline" | "tasks" | "team-conversation-outline" | "team-conversation" | "team-sprout-outline" | "team-sprout" | "team" | "text-asset" | "text" | "tiktok" | "times" | "tools" | "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" | "underline" | "unfollow-outline" | "unfollow" | "unlink" | "unlock" | "upload" | "user-circle" | "users" | "verified" | "video-camera-story" | "video-camera" | "vip" | "weight" | "whatsapp" | "window-maximize" | "window-minimize" | "window-regular" | "window-restore" | "woocommerce" | "x" | "yelp-full-star" | "yelp-half-star" | "yelp" | "youtube" | "zendesk";

package/__flow__/EnumIllustrationNames.flow.js

@@ -1,2 +1,2 @@
 // @flow
-export type EnumIllustrationNames = "abacus" | "analytics-offering" | "asset-cards" | "astronaut" | "binoculars" | "brand-keyword" | "browser-doc" | "business" | "calendar-event" | "calendar-reporting" | "cat-error" | "cat-no-access" | "cat" | "checkbox-alert" | "coffee-cup" | "competitors" | "compose-window" | "compose" | "computer-error" | "connect" | "contact" | "conversation" | "custom-branding" | "customer-service" | "dashboard" | "exclamation-mark" | "face-happy" | "find-bookmark" | "flask" | "general-topic" | "global-features" | "global-trend" | "grow-large" | "grow" | "hands-raised" | "headset" | "heartbeat-connection" | "instagram-links" | "invoice" | "jewel" | "keyword-tracking" | "lightbulb-alt" | "lightbulb" | "like-conversation" | "link-broken" | "link-messages" | "link-sections" | "link-upload" | "listening-pendo" | "listening-sentiment" | "listening-topic-templates" | "listening-tour" | "listening" | "loading" | "mailbox-empty" | "mailbox-full" | "megaphone" | "message" | "molecule" | "network-data" | "no-messages-found" | "no-notifications" | "note" | "notification" | "notifications-onboarding" | "notifications" | "organize-message" | "outbox-queue" | "outbox-reviews" | "pdf" | "planning" | "podium" | "pointer" | "publish-assets" | "publish-links" | "publishing-notifications" | "publishing" | "puzzle-piece" | "question-mark" | "reporting-folder" | "reporting" | "review-location" | "review" | "robot-assembly" | "robot-error" | "robot-happy" | "rocket" | "schedule-date" | "schedule-messages" | "search-keywords" | "search-success" | "search-trends" | "search" | "security" | "sentiment" | "shopping-bag" | "spark-line" | "sprout-mobile-app" | "stamp" | "storefront" | "success" | "tag-message" | "tag" | "team-roles" | "team" | "telescope" | "tha-mel" | "thumbs-up" | "toggle-switch" | "toolset-strength" | "tracking-time" | "twitter-messages" | "twitter-profiles" | "under-construction" | "unsubscribe" | "upward-trend" | "user-task" | "user-team" | "variable-table" | "view-connections" | "vip-list" | "warning" | "wifi" | "workflow-steps";
+export type EnumIllustrationNames = "abacus" | "analytics-offering" | "asset-cards" | "astronaut" | "binoculars" | "brand-keyword" | "browser-doc" | "business" | "calendar-event" | "calendar-reporting" | "cat-error" | "cat-no-access" | "cat" | "checkbox-alert" | "coffee-cup" | "competitors" | "compose-window" | "compose" | "computer-error" | "connect" | "contact" | "conversation" | "custom-branding" | "custom-post-variables" | "customer-service" | "dashboard" | "exclamation-mark" | "face-happy" | "find-bookmark" | "flask" | "general-topic" | "global-features" | "global-trend" | "grow-large" | "grow" | "hands-raised" | "headset" | "heartbeat-connection" | "instagram-links" | "invoice" | "jewel" | "keyword-tracking" | "lightbulb-alt" | "lightbulb" | "like-conversation" | "link-broken" | "link-messages" | "link-sections" | "link-upload" | "listening-pendo" | "listening-sentiment" | "listening-topic-templates" | "listening-tour" | "listening" | "loading" | "mailbox-empty" | "mailbox-full" | "megaphone" | "message" | "molecule" | "network-data" | "no-messages-found" | "no-notifications" | "note" | "notification" | "notifications-onboarding" | "notifications" | "organize-message" | "outbox-queue" | "outbox-reviews" | "pdf" | "planning" | "podium" | "pointer" | "publish-assets" | "publish-links" | "publishing-notifications" | "publishing" | "puzzle-piece" | "question-mark" | "reporting-folder" | "reporting" | "review-location" | "review" | "robot-assembly" | "robot-error" | "robot-happy" | "rocket" | "schedule-date" | "schedule-messages" | "search-keywords" | "search-success" | "search-trends" | "search" | "security" | "sentiment" | "shopping-bag" | "spark-line" | "sprout-mobile-app" | "stamp" | "storefront" | "success" | "tag-message" | "tag" | "team-roles" | "team" | "telescope" | "tha-mel" | "thumbs-up" | "toggle-switch" | "toolset-strength" | "tracking-time" | "twitter-messages" | "twitter-profiles" | "under-construction" | "unsubscribe" | "upward-trend" | "user-task" | "user-team" | "variable-table" | "view-connections" | "vip-list" | "warning" | "wifi" | "workflow-steps";

package/__flow__/EnumLogoNames.flow.js

@@ -1,2 +1,2 @@
 // @flow
-export type EnumLogoNames = "adobe-experience-manager-dark" | "adobe-experience-manager" | "apple-app-store-dark" | "apple-app-store" | "bigcommerce-dark" | "bigcommerce-lockup-dark" | "bigcommerce-lockup" | "bigcommerce" | "bitly-dark" | "bitly" | "bynder-dark" | "bynder" | "canva-dark" | "canva" | "dropbox-dark" | "dropbox-lockup-dark" | "dropbox-lockup" | "dropbox-wordmark-dark" | "dropbox-wordmark" | "dropbox" | "facebook-audience-network-dark" | "facebook-audience-network" | "facebook-dark" | "facebook-groups-dark" | "facebook-groups" | "facebook-shops-dark" | "facebook-shops" | "facebook" | "feedly-dark" | "feedly" | "glassdoor-dark" | "glassdoor" | "google-analytics-dark" | "google-analytics" | "google-business-messages-dark" | "google-business-messages" | "google-drive-dark" | "google-drive" | "google-my-business-dark" | "google-my-business" | "google-play-store-dark" | "google-play-store" | "hubspot-dark" | "hubspot" | "instagram-dark" | "instagram" | "linkedin-audience-network-dark" | "linkedin-audience-network" | "linkedin-dark" | "linkedin" | "marketo-dark" | "marketo" | "messenger-dark" | "messenger" | "microsoft-dynamics-dark" | "microsoft-dynamics" | "pinterest-dark" | "pinterest" | "reddit-dark" | "reddit" | "salesforce-dark" | "salesforce" | "shopify-dark" | "shopify" | "slack-dark" | "slack" | "sproutsocial-dark" | "sproutsocial-lockup-dark" | "sproutsocial-lockup" | "sproutsocial-wordmark-dark" | "sproutsocial-wordmark" | "sproutsocial" | "tiktok-dark" | "tiktok" | "tripadvisor-dark" | "tripadvisor" | "tumblr-dark" | "tumblr" | "twitter-audience-network-dark" | "twitter-audience-network" | "twitter-dark" | "twitter" | "whatsapp-dark" | "whatsapp" | "woocommerce-dark" | "woocommerce" | "yelp-dark" | "yelp" | "youtube-dark" | "youtube" | "zendesk-dark" | "zendesk-lockup-dark" | "zendesk-lockup" | "zendesk-wordmark-dark" | "zendesk-wordmark" | "zendesk";
+export type EnumLogoNames = "adobe-experience-manager" | "android" | "apple-app-store" | "apple" | "bigcommerce" | "bitly" | "bynder" | "canva" | "dropbox" | "facebook-audience-network" | "facebook" | "facebook-groups" | "facebook-shops" | "feedly" | "github" | "glassdoor" | "google-analytics" | "google-business-messages" | "google-drive" | "google-my-business" | "google-play-store" | "hubspot" | "instagram" | "linkedin-audience-network" | "linkedin" | "marketo" | "messenger" | "microsoft-dynamics" | "pinterest" | "reddit-alien" | "reddit" | "salesforce-cloud" | "salesforce" | "shopify" | "slack" | "sproutsocial" | "tableau" | "tiktok" | "tripadvisor" | "tumblr" | "twitter-audience-network" | "twitter" | "whatsapp" | "woocommerce" | "yelp" | "youtube" | "zendesk";

package/__flow__/Icon/Icon.flow.js

@@ -2,10 +2,10 @@
 import * as React from 'react';
 import type { StyledComponent } from 'styled-components';
 import type { EnumIconNames } from "../EnumIconNames.flow";
+import type { EnumLogoNames } from "../EnumLogoNames.flow";
 import type { TypeWithDisplayName } from "../types/shared.flow";
 import type { TypeTheme } from "../types/theme.flow";
 import deprecatedIcons from "./deprecatedIcons.flow";
-import type { TypePartnerNames } from "../PartnerLogo/TypePartnerNames.flow";
 export type TypeIconSize = 'mini' // 12x12
 // TODO: deprecate default  in favor of small in future release
 | 'default' // 16x16
@@ -14,7 +14,7 @@ export type TypeIconSize = 'mini' // 12x12
 | 'large' // 32x32
 | 'jumbo'; // 64x64
 
-export type TypeIconName = EnumIconNames | $Keys<typeof deprecatedIcons> | TypePartnerNames;
+export type TypeIconName = EnumIconNames | $Keys<typeof deprecatedIcons> | EnumLogoNames;
 export type TypeIconProps = {
   /** Name of the icon in the svg sprite */
   name: TypeIconName,

package/__flow__/IconViewBoxes.js

@@ -276,6 +276,7 @@ module.exports = {
   "puzzle-piece": "0 0 18 16",
   "qr-code": "0 0 16 16",
   "queue": "0 0 16 16",
+  "quotes-solid": "0 0 18 18",
   "recommendation": "0 0 16 16",
   "reddit-alien": "0 0 16 16",
   "reddit": "0 0 16 16",

package/__flow__/IllustrationViewBoxes.js

@@ -22,6 +22,7 @@ module.exports = {
   "contact": "0 0 305 145",
   "conversation": "0 0 330 236",
   "custom-branding": "0 0 168 164",
+  "custom-post-variables": "0 0 87 57",
   "customer-service": "0 0 302 155",
   "dashboard": "0 0 337 195",
   "exclamation-mark": "0 0 219 143",

package/__flow__/LogoViewBoxes.js

@@ -1,8 +1,12 @@
 module.exports = {
   "adobe-experience-manager-dark": "0 0 16 17",
   "adobe-experience-manager": "0 0 16 17",
+  "android-dark": "0 0 18 18",
+  "android": "0 0 18 18",
   "apple-app-store-dark": "0 0 140 140",
   "apple-app-store": "0 0 140 140",
+  "apple-dark": "0 0 18 18",
+  "apple": "0 0 18 18",
   "bigcommerce-dark": "0 0 140 140",
   "bigcommerce-lockup-dark": "0 0 291 66",
   "bigcommerce-lockup": "0 0 291 66",
@@ -29,6 +33,8 @@ module.exports = {
   "facebook": "0 0 141 139",
   "feedly-dark": "0 0 141 123",
   "feedly": "0 0 141 123",
+  "github-dark": "0 0 18 18",
+  "github": "0 0 18 18",
   "glassdoor-dark": "0 0 140 196",
   "glassdoor": "0 0 140 196",
   "google-analytics-dark": "0 0 140 160",
@@ -57,8 +63,12 @@ module.exports = {
   "microsoft-dynamics": "0 0 140 227",
   "pinterest-dark": "0 0 140 141",
   "pinterest": "0 0 140 141",
+  "reddit-alien-dark": "0 0 18 18",
+  "reddit-alien": "0 0 18 18",
   "reddit-dark": "0 0 140 140",
   "reddit": "0 0 140 140",
+  "salesforce-cloud-dark": "0 0 20 18",
+  "salesforce-cloud": "0 0 20 18",
   "salesforce-dark": "0 0 140 99",
   "salesforce": "0 0 140 99",
   "shopify-dark": "0 0 140 159",
@@ -71,6 +81,10 @@ module.exports = {
   "sproutsocial-wordmark-dark": "0 0 320 52",
   "sproutsocial-wordmark": "0 0 320 52",
   "sproutsocial": "0 0 140 174",
+  "tableau-dark": "0 0 18 18",
+  "tableau-lockup-dark": "0 0 291 56",
+  "tableau-lockup": "0 0 291 56",
+  "tableau": "0 0 18 18",
   "tiktok-dark": "0 0 140 159",
   "tiktok": "0 0 140 159",
   "tripadvisor-dark": "0 0 140 140",

package/__flow__/PartnerLogo/PartnerLogo.flow.js

@@ -1,9 +1,14 @@
 // @flow
 import * as React from 'react';
-import type { TypePartnerNames } from "./TypePartnerNames.flow";
+import type { EnumLogoNames } from "../EnumLogoNames.flow";
+
+/**
+ * @deprecated Use EnumLogoNames instead
+ */
+export type TypePartnerNames = EnumLogoNames;
 export type TypePartnerLogoProps = {
   /** The name of the partner whose logo you want to render. */
-  partnerName: TypePartnerNames,
+  partnerName: EnumLogoNames,
   /** Manually override the default mode behavior by rendering a logo based on the background it's displayed on. */
   backgroundType?: 'dark' | 'light',
   logoType?: 'symbol' | 'wordmark' | 'lockup',

package/__flow__/PartnerLogo/index.flow.js

@@ -1,3 +1,2 @@
 // @flow
-export * from "./PartnerLogo.flow";
-export * from "./TypePartnerNames.flow";
+export * from "./PartnerLogo.flow";

package/__flow__/Switch/Switch.flow.js

@@ -1,24 +1,5 @@
 // @flow
 import * as React from 'react';
-export type TypeSwitchProps = {
-  onClick: (e: SyntheticEvent<HTMLButtonElement>, checked: boolean) => void,
-  checked: boolean,
-  /** Customizable object to pass in localized "On" and "Off" label text for screen readers {"on": ONTEXT, "off": OFFTEXT} */
-  a11yLabels: {
-    on: string,
-    off: string,
-    ...
-  },
-  /** Disables interaction on component and applies disabled styles  */
-  disabled: boolean,
-  name?: string,
-  qa?: Object,
-  ...
-};
-declare var Switch: React.ComponentType<{
-  ...TypeSwitchProps,
-  a11yLabels?: $PropertyType<TypeSwitchProps, 'a11yLabels'>,
-  disabled?: $PropertyType<TypeSwitchProps, 'disabled'>,
-  ...
-}>;
+import type { TypeSwitchProps } from "./SwitchTypes.flow";
+declare export var Switch: React.StatelessFunctionalComponent<TypeSwitchProps>;
 declare export default typeof Switch;

package/__flow__/Switch/SwitchTypes.flow.js

@@ -0,0 +1,16 @@
+// @flow
+import type { TypeColorSystemProps, TypeLayoutSystemProps, TypeSpaceSystemProps } from "../systemProps/index.flow";
+export type TypeSwitchProps = {
+  ...TypeColorSystemProps,
+  ...TypeLayoutSystemProps,
+  ...TypeSpaceSystemProps,
+  onClick: (e: SyntheticEvent<HTMLButtonElement>, checked: boolean) => void,
+  checked: boolean,
+  name?: string,
+  loading?: boolean,
+  disabled?: boolean,
+  a11yLabels?: void,
+
+    // removed prop
+  ...
+};

package/__flow__/Switch/index.flow.js

@@ -1,2 +1,3 @@
 // @flow
-export * from "./Switch.flow";
+export * from "./Switch.flow";
+export * from "./SwitchTypes.flow";

package/__flow__/Toast/Toast.flow.js

@@ -1,13 +1,13 @@
 // @flow
 import * as React from 'react';
 import type { TypeColor } from "../types/theme.flow";
-import type { EnumIconNames } from "../EnumIconNames.flow";
+import type { TypeIconName } from "../Icon/Icon.flow";
 export type TypeToastTheme = 'info' | 'success' | 'warning' | 'error';
 export type TypeToastProps = {|
   theme?: TypeToastTheme,
   content: React.Node,
   color?: TypeColor,
-  icon?: EnumIconNames,
+  icon?: TypeIconName,
 |};
 export type TypeToastOptions = {|
   ...TypeToastProps,

package/__flow__/index.flow.js

@@ -58,7 +58,7 @@ export { default as Select } from "./Select/index.flow";
 export { default as Skeleton } from "./Skeleton/index.flow";
 export { default as SpotIllustration } from "./SpotIllustration/index.flow";
 export { default as Stack } from "./Stack/index.flow";
-export { default as Switch } from "./Switch/index.flow";
+export * from "./Switch/index.flow";
 export { default as Table } from "./Table/index.flow";
 export { default as TableCell } from "./TableCell/index.flow";
 export { default as TableHeaderCell } from "./TableHeaderCell/index.flow";
@@ -105,15 +105,13 @@ export type { EnumDensities, TypeMessageProps } from "./Message/index.flow";
 export type { TypeModalProps, TypeModalContentProps, TypeModalFooterProps, TypeModalHeaderProps } from "./Modal/index.flow";
 export type { TypeNumeralProps } from "./Numeral/index.flow";
 export type { TypeOverflowListProps, TypeVirtualizedListProps } from "./OverflowList/index.flow";
-export type { TypePartnerLogoProps } from "./PartnerLogo/index.flow";
-export type { TypePartnerNames } from "./PartnerLogo/TypePartnerNames.flow";
+export type { TypePartnerLogoProps, TypePartnerNames } from "./PartnerLogo/index.flow";
 export type { EnumPlacements, TypePopoutProps } from "./Popout/index.flow";
 export type { TypeRadioProps } from "./Radio/index.flow";
 export type { TypeSegmentedControlProps, TypeSegmentedControlItemProps } from "./SegmentedControl/index.flow";
 export type { TypeSelectProps } from "./Select/index.flow";
 export type { TypeSpotIllustrationProps } from "./SpotIllustration/index.flow";
 export type { TypeStackProps } from "./Stack/index.flow";
-export type { TypeSwitchProps } from "./Switch/index.flow";
 export type { TypeTableProps, TypeTableRow } from "./Table/index.flow";
 export type { TypeTableCell, TypeTableCellProps } from "./TableCell/index.flow";
 export type { TypeEnumSortDirections, TypeTableHeaderCell,

package/commonjs/Badge/Badge.flow.js

@@ -2,5 +2,6 @@
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 var React = _interopRequireWildcard(require("react"));
+var _constants = require("./constants.flow");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/commonjs/Badge/constants.flow.js

@@ -1 +1,20 @@
-"use strict";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.badgeColors = void 0;
+var badgeColors = Object.freeze({
+  green: 'green',
+  blue: 'blue',
+  purple: 'purple',
+  yellow: 'yellow',
+  orange: 'orange',
+  red: 'red',
+  neutral: 'neutral',
+  magenta: 'magenta',
+  pink: 'pink',
+  aqua: 'aqua',
+  teal: 'teal'
+});
+exports.badgeColors = badgeColors;

package/commonjs/Badge/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.legacyBadgeColors = void 0;
+exports.legacyBadgeColors = exports.badgeColors = void 0;
 var defaultPurple = {
   color: 'colors.text.body',
   background: 'colors.container.background.decorative.purple'
@@ -47,4 +47,18 @@ var legacyBadgeColors = {
   default: defaultPurple,
   suggestion: suggestion
 };
-exports.legacyBadgeColors = legacyBadgeColors;
+exports.legacyBadgeColors = legacyBadgeColors;
+var badgeColors = {
+  green: 'green',
+  blue: 'blue',
+  purple: 'purple',
+  yellow: 'yellow',
+  orange: 'orange',
+  red: 'red',
+  neutral: 'neutral',
+  magenta: 'magenta',
+  pink: 'pink',
+  aqua: 'aqua',
+  teal: 'teal'
+};
+exports.badgeColors = badgeColors;

package/commonjs/Banner/Banner.js

@@ -10,7 +10,7 @@ var _Box = _interopRequireDefault(require("../Box"));
 var _Button = _interopRequireDefault(require("../Button"));
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _styles = _interopRequireWildcard(require("./styles"));
-var _excluded = ["type", "text", "onClose", "closeButtonLabel"];
+var _excluded = ["type", "text", "onClose", "closeButtonLabel", "typeIconProps"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -56,6 +56,7 @@ var Banner = function Banner(_ref) {
     onClose = _ref.onClose,
     _ref$closeButtonLabel = _ref.closeButtonLabel,
     closeButtonLabel = _ref$closeButtonLabel === void 0 ? 'Close' : _ref$closeButtonLabel,
+    typeIconProps = _ref.typeIconProps,
     rest = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement(_styles.default, _extends({
     type: type,
@@ -66,14 +67,14 @@ var Banner = function Banner(_ref) {
     display: "flex",
     alignItems: "center",
     width: 1
-  }, /*#__PURE__*/React.createElement(_styles.StyledBannerIcon, {
+  }, /*#__PURE__*/React.createElement(_styles.StyledBannerIcon, _extends({
     name: getBannerIconName(type),
     color: getBannerIconColor(type),
     className: "Icon",
     fixedWidth: true,
     mt: "3px",
     mr: 400
-  }), text, onClose && /*#__PURE__*/React.createElement(_Box.default, {
+  }, typeIconProps)), text, onClose && /*#__PURE__*/React.createElement(_Box.default, {
     ml: "auto",
     pl: 400,
     alignSelf: "flex-start"

package/commonjs/Card/Card.js

@@ -51,13 +51,17 @@ var Card = function Card(_ref) {
     hasSubComponent = _useState2[0],
     setHasSubComponent = _useState2[1];
   var containerRef = (0, _react.useRef)(null);
+  var linkRef = (0, _react.useRef)(null);
+  var isRoleLink = role === 'link';
   var checkedConditions = role === 'checkbox' ? selected : undefined;
+  var cardContext = {
+    setHasSubComponent: setHasSubComponent,
+    href: href,
+    linkRef: linkRef
+  };
   var handleClickConditions = function handleClickConditions(e) {
-    return role === 'link' ? (0, _utils.navigateTo)({
-      e: e,
-      href: href,
-      ref: containerRef
-    }) : onClick === null || onClick === void 0 ? void 0 : onClick(e);
+    var _linkRef$current;
+    return isRoleLink ? (_linkRef$current = linkRef.current) === null || _linkRef$current === void 0 ? void 0 : _linkRef$current.click() : onClick === null || onClick === void 0 ? void 0 : onClick(e);
   };
   var handleKeyDown = function handleKeyDown(e) {
     return (0, _utils.onKeyDown)({
@@ -69,8 +73,8 @@ var Card = function Card(_ref) {
     });
   };
   return /*#__PURE__*/_react.default.createElement(_styles.StyledCard, _extends({
-    tabIndex: 0,
-    role: role,
+    tabIndex: isRoleLink ? -1 : 0,
+    role: isRoleLink ? undefined : role,
     onClick: handleClickConditions,
     onKeyDown: handleKeyDown,
     $elevation: elevation,
@@ -79,11 +83,12 @@ var Card = function Card(_ref) {
     "aria-checked": checkedConditions,
     $disabled: disabled,
     "aria-disabled": disabled && disabled,
-    $compositionalComponents: hasSubComponent
+    $compositionalComponents: hasSubComponent,
+    $isRoleLink: isRoleLink
   }, rest), /*#__PURE__*/_react.default.createElement(_subComponents.SelectedIcon, {
     $selected: selected
   }), /*#__PURE__*/_react.default.createElement(_utils.SubComponentContext.Provider, {
-    value: setHasSubComponent
+    value: cardContext
   }, children));
 };
 var _default = Card;

package/commonjs/Card/index.js

@@ -7,7 +7,8 @@ var _exportNames = {
   Card: true,
   CardHeader: true,
   CardContent: true,
-  CardFooter: true
+  CardFooter: true,
+  CardLink: true
 };
 Object.defineProperty(exports, "Card", {
   enumerable: true,
@@ -33,6 +34,12 @@ Object.defineProperty(exports, "CardHeader", {
     return _subComponents.CardHeader;
   }
 });
+Object.defineProperty(exports, "CardLink", {
+  enumerable: true,
+  get: function get() {
+    return _subComponents.CardLink;
+  }
+});
 exports.default = void 0;
 var _Card = _interopRequireDefault(require("./Card"));
 var _subComponents = require("./subComponents");