@sproutsocial/racine 19.0.0 → 20.0.0

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # Change Log
 
+## 20.0.0
+
+### Major Changes
+
+- d3b6122f: **Breaking Change**: Uses @sproutsocial/seeds-icons for Icon assets
+
+  - Icon assets are now stored in a new package called @sproutsocial/seeds-icons.
+  - @sproutsocial/seeds-icons is now a peer and dev dependency of Racine.
+  - All icons now have solid and outline variants, with outline being the default. Variants are specified as a part of the icon name (e.g., `bell-solid`); if omitted, the outline version will be rendered by default.
+
+  To recap the migration steps from our announcement of these changes:
+
+  - Sprites: Instead of using icon.svg from Racine’s dist/ directory, the sprites should be imported from @sproutsocial/seeds-icons for each category of icons you want to include. Attach these spritesheets to the DOM in the same way you do icon.svg.
+  - Dependencies: Add @sproutsocial/seeds-icons to your application’s dependencies.
+  - Icons: Most icon names are changing as a part of this refactor. Run the 'icon-library' codemod to automatically update as many icon names as possible. The codemod cannot fix Icon components where the name prop is not a string, but the codemod will (by default) add a code comment when this occurs, to help you find cases where you need to manually update icon names.
+  - Icon variants: The codemod may not always map to the correct variant for your use case. In these cases, manually update the variant by updating the icon `name` prop.
+
+- d3b6122f: Removes reddit-alien PartnerLogo in favor of reddit
+  - The `reddit` PartnerLogo is also updated to look like the `reddit-alien` PartnerLogo did
+
+## 19.0.1
+
+### Patch Changes
+
+- 52e76ee2: Overriding the type for `React.HTMLAttributes` so that it included `data-*` attributes
+  - This fixes a bug which did not allow passing data attributes on `Input.inputProps`
+  - Also updates `React.ComponentProps` since it consumed `React.HTMLAttributes`
+- d9df9d52: Fixing a bug in CardLink component that opened two tabs when clicked
+
 ## 19.0.0
 
 ### Major Changes

package/__flow__/EnumLogoNames.flow.js

@@ -1,2 +1,2 @@
 // @flow
-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";
+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" | "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

@@ -1,11 +1,10 @@
 // @flow
 import * as React from 'react';
 import type { StyledComponent } from 'styled-components';
-import type { EnumIconNames } from "../EnumIconNames.flow";
+import type { EnumIconNames } from '@sproutsocial/seeds-icons';
 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";
 export type TypeIconSize = 'mini' // 12x12
 // TODO: deprecate default  in favor of small in future release
 | 'default' // 16x16
@@ -14,7 +13,8 @@ export type TypeIconSize = 'mini' // 12x12
 | 'large' // 32x32
 | 'jumbo'; // 64x64
 
-export type TypeIconName = EnumIconNames | $Keys<typeof deprecatedIcons> | EnumLogoNames;
+export type TypeIconNames = EnumIconNames;
+export type TypeIconName = TypeIconNames | EnumLogoNames;
 export type TypeIconProps = {
   /** Name of the icon in the svg sprite */
   name: TypeIconName,
@@ -28,9 +28,9 @@ export type TypeIconProps = {
 };
 export type TypeToggleProps = {
   /** Name of the icon to be shown in the active state */
-  activeName: EnumIconNames,
+  activeName: TypeIconName,
   /** Name of the icon to be shown in the inactive state */
-  inactiveName: EnumIconNames,
+  inactiveName: TypeIconName,
   /** Whether the active icon should be shown or not */
   isActive: boolean,
   /** The size of the icon. `small` is the default */

package/__flow__/Icon/index.flow.js

@@ -1,2 +1,4 @@
 // @flow
+import Icon from "./Icon.flow";
+export { Icon };
 export * from "./Icon.flow";

package/__flow__/LogoViewBoxes.js

@@ -63,10 +63,8 @@ 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",
+  "reddit-dark": "0 0 18 17",
+  "reddit": "0 0 18 17",
   "salesforce-cloud-dark": "0 0 20 18",
   "salesforce-cloud": "0 0 20 18",
   "salesforce-dark": "0 0 140 99",

package/__flow__/index.flow.js

@@ -1,7 +1,7 @@
 // @flow
 
 /* Asset types */
-export type { EnumIconNames } from "./EnumIconNames.flow";
+export type { EnumIconNames } from '@sproutsocial/seeds-icons';
 export type { EnumIllustrationNames } from "./EnumIllustrationNames.flow";
 export type { EnumLogoNames } from "./EnumLogoNames.flow";
 
@@ -35,7 +35,7 @@ export { default as Drawer } from "./Drawer/index.flow";
 export { default as EmptyState } from "./EmptyState/index.flow";
 export { default as Fieldset } from "./Fieldset/index.flow";
 export { default as FormField } from "./FormField/index.flow";
-export { default as Icon } from "./Icon/index.flow";
+export * from "./Icon/index.flow";
 export { default as Image } from "./Image/index.flow";
 export { default as Indicator } from "./Indicator/index.flow";
 export { default as Input } from "./Input/index.flow";
@@ -89,7 +89,6 @@ export type { TypeDrawerProps, TypeDrawerCloseButtonProps, TypeDrawerHeaderProps
 export type { TypeEmptyStateProps } from "./EmptyState/index.flow";
 export type { TypeFieldsetProps } from "./Fieldset/index.flow";
 export type { TypeFormFieldProps } from "./FormField/index.flow";
-export type { TypeIconProps, TypeIconName, TypeToggleProps } from "./Icon/index.flow";
 export type { TypeImageProps } from "./Image/index.flow";
 export type { TypeIndicatorProps } from "./Indicator/index.flow";
 export type { TypeInputProps } from "./Input/index.flow";

package/bin/racine-codemod.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 
-// racine-codemod name-of-transform path/to/src
+// to run codemod: node bin/racine-codemod name-of-transform path/to/src
 // Respectfully adapted from https://github.com/reactjs/react-codemod/blob/master/bin/react-codemod.js
 
 const childProcess = require('child_process');
@@ -61,18 +61,16 @@ const filePath = path.join('../codemods', transform + '.js');
 const relativePath = path.join(currentDir, dest);
 const userArgs = [...process.argv]
   .slice(4)
-  .map((arg) => arg.replace(/\s/g, ''))
-  .join(' ');
+  .map((arg) => arg.replace(/\s/g, ''));
 
 const args = [
   'jscodeshift',
   '--',
-  '--parser=flow',
   '-t',
   filePath,
   relativePath,
   '--ignore-pattern=**/node_modules/**',
-  userArgs,
+  ...userArgs,
 ];
 
 childProcess.execFileSync('npx', args, {stdio: 'inherit'});

package/codemods/__tests__/icon-library.test.js

@@ -38,7 +38,7 @@ describe('icon-library codemod', () => {
   );
 
   createTest(
-    'ssiconsvg regex replacements',
+    'ssiconsvg icon regex replacements',
     `<use
     xlink:href="#ssiconsvg-rejected"
     xmlns:xlink="http://www.w3.org/1999/xlink"
@@ -49,6 +49,18 @@ describe('icon-library codemod', () => {
   />`
   );
 
+  createTest(
+    'ssiconsvg logo regex replacements',
+    `<use
+    xlink:href="#ssiconsvg-facebook"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+  />`,
+    `<use
+    xlink:href="#sslogosvg-facebook"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+  />`
+  );
+
   createTest(
     'icon/iconName regex replacements',
     `expect(queryByDataQaLabel({icon: 'dashboard'})).toBeFalsy();
@@ -82,7 +94,8 @@ import { Badge, Icon } from '@sproutsocial/racine';
   // Test shim component adding behavior with a mix of cases.
   // The valid name Icon is migrated.
   // The invalid string name Icon prompts a comment. The shim would not help map an invalid string name.
-  // The variable name Icon is converted to IconShim and does not contribute to the count of issues in the comment.
+  // A partner name is left as-is and does not contribute to the count of issues.
+  // The variable name Icon is converted to IconShim and does not contribute to the count of issues.
   createTest(
     'Add shim component and add comments',
     `import { Icon } from '@sproutsocial/racine';
@@ -90,6 +103,7 @@ import { Badge, Icon } from '@sproutsocial/racine';
 <>
   <Icon name='dashboard' />
   <Icon name='not-a-real-name' />
+  <Icon name='facebook' />
   <Icon name={iconName} />
 </>`,
     `/*TODO (icon-library codemod): Please manually migrate icon names passed to 1 component(s) in this file.
@@ -101,6 +115,7 @@ import { IconShim } from 'script/core/react/IconShim';
 <>
   <Icon name='gauge-outline' />
   <Icon name='not-a-real-name' />
+  <Icon name='facebook' />
   <IconShim name={iconName} />
 </>`,
     {

package/codemods/artifacts/deprecated-icon-map.json

@@ -0,0 +1,38 @@
+{
+  "backtotop": "back-to-top",
+  "circle-check-filled": "circle-check",
+  "circle-check-no-fill": "circle-check",
+  "circle-check-inverse-outline": "circle-check-outline",
+  "circle-check-inverse": "circle-check-outline",
+  "circle+-filled": "plus-outline",
+  "circlex-filled": "circle-x-outline",
+  "circle+-nofill": "plus-outline",
+  "circlex-nofill": "circle-x-outline",
+  "creditcard": "credit-card",
+  "direct-message": "messages",
+  "facebook-nofill": "facebook",
+  "googleanalytics": "google-analytics",
+  "instagram-brand-keyword": "hashtag",
+  "help-white": "help",
+  "info-white": "info",
+  "instagram-nofill": "instagram",
+  "key-circle": "key",
+  "key-square": "key",
+  "linkedin-nofill": "linkedin",
+  "listening-home": "listening",
+  "location-pub": "location",
+  "location-pub-outline": "location-outline",
+  "publishing-calendar": "calendar",
+  "qrcode": "qr-code",
+  "sparkles-solid": "sparkles",
+  "star-inverse": "star-outline",
+  "triangle-white": "triangle",
+  "triangle-nofill": "triangle",
+  "tripadvisor-circle-filled": "tripadvisor-circle",
+  "tripadvisor-circle-empty": "tripadvisor-circle-outline",
+  "tumblr-square": "tumblr",
+  "tumblr-nofill": "tumblr",
+  "twitter-business-mention": "search",
+  "verified-nofill": "verified",
+  "window-maximize-solid": "window-maximize"
+}

package/codemods/artifacts/icon-map.json

@@ -0,0 +1,343 @@
+{
+  "active-listener": "listening-outline",
+  "add-item": "plus-outline",
+  "add-keyword": "plus-outline",
+  "add-team-member": "user-plus-outline",
+  "add-variable": "curly-brackets-plus-outline",
+  "address-card-outline": "profile-card-outline",
+  "address-card-solid": "profile-card-solid",
+  "ads": "dollar-outline",
+  "advocacy-outline": "advocacy-outline",
+  "advocacy": "advocacy-solid",
+  "approval-indicator-outline": "stamp-outline",
+  "approval-indicator": "stamp-solid",
+  "archive": "file-box-outline",
+  "arrow-down-line": "arrow-down-to-line-outline",
+  "arrow-down": "arrow-down-outline",
+  "arrow-left-line": "arrow-left-to-line-outline",
+  "arrow-left": "arrow-left-outline",
+  "arrow-right-line": "arrow-right-to-line-outline",
+  "arrow-right": "arrow-right-outline",
+  "arrow-up-line": "arrow-up-to-line-outline",
+  "arrow-up": "arrow-up-outline",
+  "arrows": "arrows-up-down-left-right-outline",
+  "asset-library-outline": "asset-library-outline",
+  "asset-library": "asset-library-solid",
+  "assign": "sitemap-outline",
+  "atom": "atom-outline",
+  "audio": "audio-outline",
+  "back-to-top": "arrow-up-outline",
+  "bambu-icon-outline": "bambu-outline",
+  "bambu-icon": "bambu-solid",
+  "barcode": "barcode-outline",
+  "basketball": "basketball-outline",
+  "bell-outline": "bell-outline",
+  "bold": "bold-outline",
+  "book": "book-outline",
+  "bookmark-filled": "bookmark-solid",
+  "bookmark": "bookmark-outline",
+  "bot": "robot-outline",
+  "browser": "window-full-outline",
+  "bulk-select": "square-check-outline",
+  "business": "briefcase-outline",
+  "calendar-outline": "calendar-outline",
+  "calendar": "calendar-solid",
+  "camera-outline": "camera-outline",
+  "camera-story": "camera-story-solid",
+  "camera": "camera-solid",
+  "campaign": "megaphone-outline",
+  "carousel": "carousel-outline",
+  "cart-plus": "cart-plus-outline",
+  "check": "check-outline",
+  "chevron-down-filled": "caret-down-outline",
+  "chevron-down": "chevron-down-outline",
+  "chevron-left": "chevron-left-outline",
+  "chevron-right": "chevron-right-outline",
+  "chevron-up-down-filled": "caret-up-down-outline",
+  "chevron-up-filled": "caret-up-outline",
+  "chevron-up": "chevron-up-outline",
+  "circle-check-outline": "circle-check-outline",
+  "circle-check": "circle-check-solid",
+  "circle": "circle-no-fill-outline",
+  "circle+": "plus-outline",
+  "circles": "large-circle-small-circle-outline",
+  "circleX": "circle-x-outline",
+  "circlex": "circle-x-outline",
+  "click-to-view": "hand-pointer-clicking-outline",
+  "clicks": "pointer-outline",
+  "clipboard-outline": "clipboard-outline",
+  "clipboard": "clipboard-solid",
+  "clock": "clock-outline",
+  "closed-captioning": "closed-caption-outline",
+  "cloud": "cloud-outline",
+  "code": "code-outline",
+  "columns": "columns-outline",
+  "comment-alt-outline": "comments-outline",
+  "comment-alt": "comment-solid",
+  "comment-lines-alt-outline": "comment-outline",
+  "comment": "comments-outline",
+  "compact-density": "bars-density-small-outline",
+  "compact-indicator": "bars-density-small-outline",
+  "comparison": "diamond-vs-outline",
+  "competitor": "office-building-outline",
+  "compose": "pencil-to-square-outline",
+  "content-suggestions": "comment-sparkle-outline",
+  "credit-card": "credit-card-outline",
+  "crop": "crop-outline",
+  "crown": "crown-outline",
+  "dashboard": "gauge-outline",
+  "deconstructed-negative-sentiment": "expression-frown-outline",
+  "deconstructed-neutral-sentiment": "expression-neutral-outline",
+  "deconstructed-positive-sentiment": "expression-smile-open-outline",
+  "discovery": "compass-outline",
+  "dislike-outline": "thumbs-down-outline",
+  "dislike": "thumbs-down-solid",
+  "dm-link-outline": "comment-plus-outline",
+  "dm-link": "comment-plus-solid",
+  "doesnt-recommend": "comment-star-slash-outline",
+  "dotdotdot": "ellipsis-horizontal-outline",
+  "download": "arrow-down-to-bracket-outline",
+  "drafts-outline": "paper-outline",
+  "drafts": "paper-solid",
+  "duplicate-outline": "papers-outline",
+  "duplicate": "papers-solid",
+  "emoji-outline": "face-smile-outline",
+  "emoji": "face-smile-solid",
+  "empty-image": "camera-x-outline",
+  "engagement-per-post": "comment-outline",
+  "engagements": "comments-outline",
+  "error": "circle-exclamation-outline",
+  "exchange-alt": "arrows-left-right-outline",
+  "expanded-indicator": "bars-density-large-outline",
+  "export": "square-round-arrow-up-right-outline",
+  "extended-circles": "large-circle-small-circle-outline",
+  "external-link-alt": "squares-arrow-up-right-outline",
+  "external-link": "square-round-arrow-up-right-outline",
+  "extreme-negative-sentiment": "face-frown-open-outline",
+  "eye-outline": "eye-outline",
+  "eye-slash-outline": "eye-slash-outline",
+  "eye-slash": "eye-slash-solid",
+  "eye": "eye-solid",
+  "facebook-branded-content-outline": "handshake-outline",
+  "facebook-branded-content": "handshake-solid",
+  "feeds": "unordered-list-outline",
+  "female": "symbol-venus-outline",
+  "file-chart-line": "paper-bars-outline",
+  "file-edit": "paper-pencil-outline",
+  "file-times-solid": "paper-x-outline",
+  "filter": "filter-outline",
+  "flag-outline": "flag-outline",
+  "flag": "flag-solid",
+  "flat-positive-sentiment": "face-smile-outline",
+  "flat-positive-sentiment-outline": "face-smile-outline",
+  "flat-negative-sentiment": "face-frown-outline",
+  "flat-negative-sentiment-outline": "face-frown-outline",
+  "flat-neutral-sentiment": "face-neutral-outline",
+  "flat-neutral-sentiment-outline": "face-neutral-outline",
+  "folder-open": "folder-open-outline",
+  "folder": "folder-outline",
+  "follow-outline": "user-plus-outline",
+  "follow": "user-plus-solid",
+  "follower-increase": "user-arrow-up-outline",
+  "following": "user-check-outline",
+  "font": "font-case-outline",
+  "full-access": "circle-fill-outline",
+  "gear": "gear-outline",
+  "gears": "gear-outline",
+  "glasses": "glasses-outline",
+  "globe": "globe-outline",
+  "google-analytics-color": "google-analytics",
+  "grip": "grip-lines-vertical-outline",
+  "h1": "h1-outline",
+  "h2": "h2-outline",
+  "h3": "h3-outline",
+  "h4": "h3-outline",
+  "hamburger": "horizontal-lines-outline",
+  "hand-sparkle-outline": "hand-sparkle-outline",
+  "hand-sparkle": "hand-sparkle-solid",
+  "hashtag": "hashtag-outline",
+  "headset": "headset-outline",
+  "heart-outline": "heart-outline",
+  "heart": "heart-solid",
+  "heartbeat": "heart-pulse-outline",
+  "help-alt": "question-mark-outline",
+  "help": "circle-question-outline",
+  "hiking": "person-hiking-outline",
+  "history": "clock-rotate-left-outline",
+  "home": "house-outline",
+  "hourglass": "hourglass-outline",
+  "image-caption": "rectangle-caption-outline",
+  "image": "image-outline",
+  "images": "images-outline",
+  "impressions-per-post": "comment-eye-outline",
+  "impressions": "eye-outline",
+  "inactive-listener": "file-box-outline",
+  "inbox-action": "inbox-check-outline",
+  "inbox-views": "inboxes-outline",
+  "inbox": "inbox-outline",
+  "indicator": "circle-fill-outline",
+  "industry": "office-building-outline",
+  "info": "circle-i-outline",
+  "internal-activity-outline": "clock-rotate-left-outline",
+  "internal-activity": "clock-rotate-left-solid",
+  "italic": "italics-outline",
+  "key": "key-outline",
+  "keyboard": "keyboard-outline",
+  "laptop-phone": "laptop-mobile-outline",
+  "large-density": "bars-density-large-outline",
+  "lift": "circle-dollar-arrow-up-outline",
+  "like-outline": "thumbs-up-outline",
+  "like": "thumbs-up-solid",
+  "link": "link-outline",
+  "list-ol": "ordered-list-outline",
+  "listening": "listening-outline",
+  "lists": "unordered-list-outline",
+  "location-outline": "location-pin-outline",
+  "location": "location-pin-solid",
+  "lock": "lock-outline",
+  "magic-wand": "magic-wand-outline",
+  "male": "symbol-mars-outline",
+  "mention": "symbol-at-outline",
+  "message-preview-outline": "eye-outline",
+  "message-preview": "eye-solid",
+  "message": "comment-outline",
+  "messages-outline": "envelope-outline",
+  "messages": "envelope-solid",
+  "metric-table": "metric-table-outline",
+  "minus": "minus-outline",
+  "mobile": "mobile-outline",
+  "monitor": "pulse-outline",
+  "moon": "moon-crescent-outline",
+  "negative-sentiment": "face-frown-outline",
+  "neutral-positive-sentiment": "face-smile-outline",
+  "neutral-sentiment": "face-neutral-outline",
+  "new-trend": "fire-outline",
+  "newspaper": "newspaper-outline",
+  "no-access": "circle-minus-outline",
+  "no-notifications-filled": "bell-slash-solid",
+  "no-notifications": "bell-slash-outline",
+  "notepad": "clipboard-outline",
+  "notifications-publishing-outline": "alarm-clock-outline",
+  "notifications-publishing": "alarm-clock-solid",
+  "notifications": "bell-outline",
+  "offline": "wifi-slash-outline",
+  "online": "wifi-outline",
+  "paid-promotion-outline": "circle-dollar-outline",
+  "paid-promotion": "circle-dollar-solid",
+  "paid": "calculator-outline",
+  "paint": "paint-can-outline",
+  "palette": "art-palette-outline",
+  "paperclip": "paperclip-outline",
+  "pause": "pause-outline",
+  "pencil-outline": "pencil-outline",
+  "pencil": "pencil-solid",
+  "person": "user-outline",
+  "phone": "phone-outline",
+  "pinterest-boards-outline": "mood-boards-outline",
+  "pinterest-boards": "mood-boards-solid",
+  "play-circle": "play-outline",
+  "play": "play-outline",
+  "plug": "plug-outline",
+  "plus": "plus-outline",
+  "positive-sentiment": "face-smile-open-outline",
+  "power-up-outline": "lightning-bolt-outline",
+  "power-up": "lightning-bolt-solid",
+  "profile-connect": "leaf-plus-outline",
+  "profile-disconnect": "leaf-minus-outline",
+  "publishing-outline": "paper-plane-outline",
+  "publishing": "paper-plane-outline",
+  "puzzle-piece": "puzzle-piece-outline",
+  "qr-code": "qr-code-outline",
+  "queue": "queue-outline",
+  "recommendation": "comment-star-outline",
+  "reels-outline": "reels-outline",
+  "reels": "reels-solid",
+  "referrals": "star-full-outline",
+  "refresh": "arrows-rotate-outline",
+  "rejected": "ban-outline",
+  "reply-outline": "reply-outline",
+  "reply": "reply-solid",
+  "reporting-period": "calendar-range-outline",
+  "reporting": "chart-bar-simple-outline",
+  "reports-home": "four-squares-outline",
+  "reports": "chart-pie-outline",
+  "retweet": "repost-outline",
+  "route": "route-outline",
+  "rss": "rss-outline",
+  "sales": "dollar-outline",
+  "save-assets": "asset-library-plus-outline",
+  "saved-messages": "comment-bookmark-outline",
+  "saved-reply-outline": "bookmark-reply-outline",
+  "saved-reply": "bookmark-reply-solid",
+  "search": "magnifying-glass-outline",
+  "send-again": "paper-plane-arrows-rotate-solid",
+  "send-again-outline": "paper-plane-arrows-rotate-outline",
+  "sent-message-outline": "inbox-arrow-up-outline",
+  "sent-message": "inbox-arrow-up-solid",
+  "share": "square-round-arrow-up-right-outline",
+  "shopping-bag-outline": "shopping-bag-outline",
+  "shopping-bag": "shopping-bag-solid",
+  "show-navigation": "browser-nav-bar-outline",
+  "small-density": "bars-density-medium-outline",
+  "smiley": "face-smile-outline",
+  "some-access": "circle-half-outline",
+  "sparkles": "sparkle-outline",
+  "spike-alert": "comment-exclamation-outline",
+  "star-half-alt-solid": "star-half-outline",
+  "star-of-life": "star-of-life-outline",
+  "star-outline": "star-outline",
+  "star": "star-full-outline",
+  "sticky-note-outline": "note-outline",
+  "sticky-note": "note-solid",
+  "story": "camera-story-outline",
+  "stories": "story-outline",
+  "suggestions": "comment-light-bulb-outline",
+  "sun": "sun-outline",
+  "tag-outline": "tag-outline",
+  "tag": "tag-solid",
+  "targeting-outline": "bullseye-arrow-outline",
+  "targeting": "bullseye-arrow-solid",
+  "tasks-check-outline": "thumbtack-check-outline",
+  "tasks-check": "thumbtack-check-solid",
+  "tasks-outline": "thumbtack-outline",
+  "tasks": "thumbtack-solid",
+  "team-conversation-outline": "sprout-leaf-lightning-bolt-outline",
+  "team-conversation": "sprout-leaf-lightning-bolt-solid",
+  "team": "users-outline",
+  "text-asset": "text-serif-outline",
+  "text": "text-serif-outline",
+  "times": "x-outline",
+  "tools": "screwdriver-hammer-outline",
+  "trash-can-outline": "trash-outline",
+  "trash-can": "trash-solid",
+  "trend-down": "arrow-right-down-outline",
+  "trend-up": "arrow-right-up-outline",
+  "trend-neutral": "arrow-right-outline",
+  "trends": "fire-outline",
+  "triangle-black": "triangle-outline",
+  "triangle": "triangle-exclamation-outline",
+  "trophy-outline": "trophy-outline",
+  "underline": "underline-outline",
+  "unfollow-outline": "user-x-outline",
+  "unfollow": "user-x-solid",
+  "unlink": "link-slash-outline",
+  "unlock": "unlock-outline",
+  "upload": "arrow-up-from-bracket-outline",
+  "user-circle": "user-sprout-outline",
+  "users": "users-outline",
+  "video-camera-story": "video-camera-story-outline",
+  "video-camera": "video-camera-outline",
+  "vip": "gem-outline",
+  "weight": "weight-outline",
+  "window-maximize": "window-modal-outline",
+  "window-minimize": "window-minimize-outline",
+  "window-regular": "browser-outline",
+  "window-restore": "browser-restore-outline",
+  "x": "x-outline",
+  "team-sprout-outline": "team-sprout-outline",
+  "team-sprout": "team-sprout-solid",
+  "tripadvisor-circle-filled": "tripadvisor-circle-solid",
+  "tripadvisor-circle-empty": "tripadvisor-circle-outline",
+  "tripadvisor-circle-outline": "tripadvisor-circle-outline",
+  "tripadvisor-circle": "tripadvisor-circle-solid"
+}

package/codemods/codemod-docs.js

@@ -8,15 +8,21 @@ const quote = {
   description:
     'What kind of quotation marks should be preferred when converting updated files back to JS?',
 };
+const parser = {
+  default: 'babel',
+  options: 'babel|babylon|flow|ts|tsx',
+  description: 'Which parser should be used to parse files to AST?',
+};
 
 module.exports = {
   'icon-library': {
     description:
       'Assists in migrating Icon names and usages. Due to abstraction such as using variables and mappings to define icon names, the codemod cannot automatically migrate every icon name. To help you identify these cases, the codemod can add comments or shim component usages.',
     example:
-      "racine-codemod icon-library src --components=\"{IconButton:['name'],MessageMeta:['iconNameLeft','iconNameRight']}\" --shimComponent=IconShim --shimImportPath=src/components/IconShim --quote=double --addComments=false",
+      "racine-codemod icon-library src --parser=tsx --components=\"{IconButton:['name'],MessageMeta:['iconNameLeft','iconNameRight']}\" --shimComponent=IconShim --shimImportPath=src/components/IconShim --quote=double --addComments=false",
     arguments: {
       quote,
+      parser,
       addComments: {
         default: 'true',
         options: 'true|false',
@@ -48,7 +54,7 @@ module.exports = {
     description:
       'Replaces string literals that are deprecated icon names with their updated names. Please note that this codemod will change any strings that happen to match a deprecated icon name, even if they are unrelated to icons, so we recommend running it against specific files (not your entire codebase) and carefully checking the results.',
     example:
-      'racine-codemod icon-name-substitution src/constants.js --quote=double',
-    arguments: {quote},
+      'racine-codemod icon-name-substitution src/constants.js --quote=double --parser=tsx',
+    arguments: {quote, parser},
   },
 };