From 969de45b04c1e25e12f881fc7bb8b1cd55b79c1b Mon Sep 17 00:00:00 2001 From: Dominik Schab <54962889+domschab23@users.noreply.github.com> Date: Thu, 26 Sep 2024 14:34:34 -0400 Subject: [PATCH] Reduce bundle size fortawesome (#1289) --- .eslintrc | 18 ++++- src/Accordion/Accordion.stories.tsx | 2 +- src/Accordion/AccordionToggle.tsx | 3 +- src/Alert/Alert.tsx | 2 +- src/Button/Button.mdx | 4 +- src/Button/Button.stories.tsx | 4 +- src/Button/Button.tsx | 4 +- src/Container/Col.tsx | 2 +- src/Container/Container.tsx | 2 +- src/Container/Row.tsx | 2 +- .../CopyToClipboardButton.tsx | 6 +- src/DateTimePicker/PickerEnforcedInput.tsx | 2 +- src/Drawer/Drawer.stories.tsx | 2 +- src/Drawer/DrawerHeader.tsx | 2 +- src/Dropdown/Dropdown.stories.tsx | 5 +- src/EmptyState/EmptyState.stories.tsx | 2 +- src/Flex/Flex.tsx | 2 +- src/FormGroup/FormGroup.stories.tsx | 2 +- src/IconButton/IconButton.tsx | 2 +- src/IconCell/IconCell.stories.tsx | 2 +- src/IconCell/IconCell.tsx | 2 +- src/LoadingOverlay/LoadingOverlay.tsx | 2 +- src/Modal/ModalHeader.tsx | 2 +- src/Pill/Pill.stories.tsx | 2 +- src/Pill/Pill.tsx | 4 +- src/ProfileCell/ProfileCell.stories.tsx | 2 +- src/RichTextEditor/RichTextEditorMenuBar.tsx | 2 +- src/Table/Table.stories.tsx | 2 +- src/Table/TableSortLabel.tsx | 2 +- src/Tooltip/Tooltip.jsx | 2 +- src/Tooltip/Tooltip.stories.jsx | 2 +- src/font_awesome/brands.ts | 19 +++++ src/font_awesome/regular.ts | 71 +++++++++++++++++++ src/font_awesome/solid.ts | 63 ++++++++++++++++ 34 files changed, 209 insertions(+), 38 deletions(-) create mode 100644 src/font_awesome/brands.ts create mode 100644 src/font_awesome/regular.ts create mode 100644 src/font_awesome/solid.ts diff --git a/.eslintrc b/.eslintrc index 7033dff3..b6345fe0 100644 --- a/.eslintrc +++ b/.eslintrc @@ -173,6 +173,22 @@ "ts": "never", "tsx": "never" } - ] + ], + "no-restricted-imports": ["error", { + "patterns": [ + { + "group": ["@fortawesome/free-brands-svg-icons/*", "@fortawesome/free-brands-svg-icons"], + "message": "Direct imports from @fortawesome/free-brands-svg-icons is not allowed. Import from src/ib/font_awesome/brands instead." + }, + { + "group": ["@fortawesome/pro-regular-svg-icons/*", "@fortawesome/pro-regular-svg-icons"], + "message": "Direct imports from @fortawesome/pro-regular-svg-icons is not allowed. Import from src/lib/font_awesome/regular instead." + }, + { + "group": ["@fortawesome/pro-solid-svg-icons/*", "@fortawesome/pro-solid-svg-icons"], + "message": "Direct imports from @fortawesome/pro-solid-svg-icons is not allowed. Import from src/lib/font_awesome/solid instead." + } + ] + }] } } diff --git a/src/Accordion/Accordion.stories.tsx b/src/Accordion/Accordion.stories.tsx index 046e26f4..3ea6b236 100644 --- a/src/Accordion/Accordion.stories.tsx +++ b/src/Accordion/Accordion.stories.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { faCreditCard } from '@fortawesome/pro-regular-svg-icons'; +import { faCreditCard } from '../font_awesome/regular'; import Card from '../Card'; import { diff --git a/src/Accordion/AccordionToggle.tsx b/src/Accordion/AccordionToggle.tsx index c292307a..b302de91 100644 --- a/src/Accordion/AccordionToggle.tsx +++ b/src/Accordion/AccordionToggle.tsx @@ -7,8 +7,9 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { useAccordionButton } from 'react-bootstrap/AccordionButton'; import AccordionContext from 'react-bootstrap/AccordionContext'; +import { faChevronUp } from '../font_awesome/solid'; + import './AccordionToggle.scss'; -import { faChevronUp } from '@fortawesome/pro-solid-svg-icons'; import { isEventKeyActive } from './utils'; diff --git a/src/Alert/Alert.tsx b/src/Alert/Alert.tsx index eebb02d2..dca60460 100644 --- a/src/Alert/Alert.tsx +++ b/src/Alert/Alert.tsx @@ -10,7 +10,7 @@ import { faExclamationTriangle, faInfo, faTimes, -} from '@fortawesome/pro-solid-svg-icons'; +} from '../font_awesome/solid'; import './Alert.scss'; diff --git a/src/Button/Button.mdx b/src/Button/Button.mdx index f83710b8..24e8c2b4 100644 --- a/src/Button/Button.mdx +++ b/src/Button/Button.mdx @@ -37,8 +37,8 @@ import * as ComponentStories from './Button.stories'; ### Iconography - Font Awesome library - We utilize the Regular and Solid Font Awesome icons - - Only use Solid icons on icon-only buttons. import `@fortawesome/pro-solid-svg-icons` - - Use Regular icons for all other buttons. import `@fortawesome/pro-regular-svg-icons` + - Only use Solid icons on icon-only buttons. import relatively from `src/font_awesome/solid` + - Use Regular icons for all other buttons. import relatively from `src/font_awesome/regular` - Use a leading icon alongside a label if there is a primary action verb (e.g. Edit, Share, Copy) - Icon-only buttons should only be permitted if - Space is limited (e.g. too small for text alone) diff --git a/src/Button/Button.stories.tsx b/src/Button/Button.stories.tsx index cb11daf5..c665599b 100644 --- a/src/Button/Button.stories.tsx +++ b/src/Button/Button.stories.tsx @@ -1,10 +1,10 @@ import React from 'react'; import { IconDefinition } from '@fortawesome/fontawesome-svg-core'; -import { faFileAlt, faCaretDown, faPaperPlane } from '@fortawesome/pro-regular-svg-icons'; +import { faFileAlt, faCaretDown, faPaperPlane } from '../font_awesome/regular'; import { faGoogle, faFacebook, faLinkedin, faTwitter, -} from '@fortawesome/free-brands-svg-icons'; +} from '../font_awesome/brands'; import Button from '.'; import mdx from './Button.mdx'; diff --git a/src/Button/Button.tsx b/src/Button/Button.tsx index b543665c..1806ef52 100644 --- a/src/Button/Button.tsx +++ b/src/Button/Button.tsx @@ -2,13 +2,13 @@ import React, { forwardRef } from 'react'; import classNames from 'classnames'; import { IconDefinition } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSpinnerThird } from '@fortawesome/pro-regular-svg-icons'; - import { Button as RBButton, type ButtonProps as RBButtonProps, } from 'react-bootstrap'; +import { faSpinnerThird } from '../font_awesome/regular'; + import './Button.scss'; export enum ButtonSizes { diff --git a/src/Container/Col.tsx b/src/Container/Col.tsx index fc768a2a..c53009e6 100644 --- a/src/Container/Col.tsx +++ b/src/Container/Col.tsx @@ -4,7 +4,7 @@ import { type ColProps as ReactBootstrapColProps, } from 'react-bootstrap'; -import { useDeprecationWarning } from 'src/utils'; +import { useDeprecationWarning } from '../utils'; export type ColProps = { /** diff --git a/src/Container/Container.tsx b/src/Container/Container.tsx index 6e4b71d3..197464c1 100644 --- a/src/Container/Container.tsx +++ b/src/Container/Container.tsx @@ -4,7 +4,7 @@ import { type ContainerProps as ReactBootstrapContainerProps, } from 'react-bootstrap'; -import { useDeprecationWarning } from 'src/utils'; +import { useDeprecationWarning } from '../utils'; export type ContainerProps = { /** diff --git a/src/Container/Row.tsx b/src/Container/Row.tsx index 8ae74de3..f95d267d 100644 --- a/src/Container/Row.tsx +++ b/src/Container/Row.tsx @@ -4,7 +4,7 @@ import { type RowProps as ReactBootstrapRowProps, } from 'react-bootstrap'; -import { useDeprecationWarning } from 'src/utils'; +import { useDeprecationWarning } from '../utils'; export type RowProps = { /** diff --git a/src/CopyToClipboardButton/CopyToClipboardButton.tsx b/src/CopyToClipboardButton/CopyToClipboardButton.tsx index e1b9ebe3..70a2eb69 100644 --- a/src/CopyToClipboardButton/CopyToClipboardButton.tsx +++ b/src/CopyToClipboardButton/CopyToClipboardButton.tsx @@ -1,9 +1,11 @@ import React, { useState } from 'react'; import classNames from 'classnames'; +import { CopyToClipboard } from 'react-copy-to-clipboard'; + import { type IconDefinition } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCopy } from '@fortawesome/pro-regular-svg-icons'; -import { CopyToClipboard } from 'react-copy-to-clipboard'; + +import { faCopy } from '../font_awesome/regular'; import TrackedButton from '../TrackedButton'; import Popper from '../Popper'; diff --git a/src/DateTimePicker/PickerEnforcedInput.tsx b/src/DateTimePicker/PickerEnforcedInput.tsx index c7ff035c..8f919fb4 100644 --- a/src/DateTimePicker/PickerEnforcedInput.tsx +++ b/src/DateTimePicker/PickerEnforcedInput.tsx @@ -4,7 +4,7 @@ import classNames from 'classnames'; import { isValid } from 'date-fns'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faCalendarAlt } from '@fortawesome/pro-regular-svg-icons'; +import { faCalendarAlt } from '../font_awesome/regular'; type PickerEnforcedInputProps = { disabled?: boolean; diff --git a/src/Drawer/Drawer.stories.tsx b/src/Drawer/Drawer.stories.tsx index 1c0df8ce..c5e15b7e 100644 --- a/src/Drawer/Drawer.stories.tsx +++ b/src/Drawer/Drawer.stories.tsx @@ -3,7 +3,7 @@ import React, { useState } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faEnvelope, faChevronLeft, faChevronRight, faTrash, -} from '@fortawesome/pro-solid-svg-icons'; +} from '../font_awesome/solid'; import { Drawer, DrawerBody, DrawerFooter, DrawerHeader, } from '.'; diff --git a/src/Drawer/DrawerHeader.tsx b/src/Drawer/DrawerHeader.tsx index abc35228..35fbc941 100644 --- a/src/Drawer/DrawerHeader.tsx +++ b/src/Drawer/DrawerHeader.tsx @@ -5,7 +5,7 @@ import { type IconDefinition } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faTimes, faCompressAlt, faExpandAlt, -} from '@fortawesome/pro-solid-svg-icons'; +} from '../font_awesome/solid'; import './DrawerHeader.scss'; diff --git a/src/Dropdown/Dropdown.stories.tsx b/src/Dropdown/Dropdown.stories.tsx index 1f835c06..94a6d809 100644 --- a/src/Dropdown/Dropdown.stories.tsx +++ b/src/Dropdown/Dropdown.stories.tsx @@ -1,10 +1,9 @@ import React from 'react'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faEllipsisV, faFileAlt, faChevronDown, faTag, faEnvelope, faTrashAlt, -} from '@fortawesome/pro-regular-svg-icons'; - -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +} from '../font_awesome/regular'; import { Dropdown, DropdownDivider, DropdownToggle, DropdownItem, DropdownMenu, } from '.'; diff --git a/src/EmptyState/EmptyState.stories.tsx b/src/EmptyState/EmptyState.stories.tsx index 34306ddc..e300b470 100644 --- a/src/EmptyState/EmptyState.stories.tsx +++ b/src/EmptyState/EmptyState.stories.tsx @@ -2,7 +2,7 @@ import React from 'react'; import type { Meta, StoryObj } from '@storybook/react'; import { IconDefinition } from '@fortawesome/fontawesome-svg-core'; -import { faPlus } from '@fortawesome/pro-regular-svg-icons'; +import { faPlus } from '../font_awesome/regular'; import Button from '../Button'; diff --git a/src/Flex/Flex.tsx b/src/Flex/Flex.tsx index 3e3616be..73925ae6 100644 --- a/src/Flex/Flex.tsx +++ b/src/Flex/Flex.tsx @@ -1,7 +1,7 @@ import { ReactNode, ElementType, createElement } from 'react'; import classNames from 'classnames'; -import { useDeprecationWarning } from 'src/utils'; +import { useDeprecationWarning } from '../utils'; import styles from './Flex.module.scss'; diff --git a/src/FormGroup/FormGroup.stories.tsx b/src/FormGroup/FormGroup.stories.tsx index 2b7f91c8..e8238493 100644 --- a/src/FormGroup/FormGroup.stories.tsx +++ b/src/FormGroup/FormGroup.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { faSearch } from '@fortawesome/pro-solid-svg-icons'; import { FlexContainer } from 'src/FlexContainer'; +import { faSearch } from '../font_awesome/solid'; import FormGroup from '.'; import Input from '../Input'; import FormControlLabel from '../FormControlLabel'; diff --git a/src/IconButton/IconButton.tsx b/src/IconButton/IconButton.tsx index 885761bc..0273512b 100644 --- a/src/IconButton/IconButton.tsx +++ b/src/IconButton/IconButton.tsx @@ -12,7 +12,7 @@ import { faPencil, faTimes, faExpandAlt, -} from '@fortawesome/pro-regular-svg-icons'; +} from '../font_awesome/regular'; import Button, { type ButtonProps } from '../Button/Button'; export const IconButtonActions = { diff --git a/src/IconCell/IconCell.stories.tsx b/src/IconCell/IconCell.stories.tsx index 44232093..4ce90718 100644 --- a/src/IconCell/IconCell.stories.tsx +++ b/src/IconCell/IconCell.stories.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { faGlobe, faMailbox, faPaperPlane, faStar, faUser, -} from '@fortawesome/pro-regular-svg-icons'; +} from '../font_awesome/regular'; import IconCell from '.'; import mdx from './IconCell.mdx'; diff --git a/src/IconCell/IconCell.tsx b/src/IconCell/IconCell.tsx index 7897337d..823b1f7d 100644 --- a/src/IconCell/IconCell.tsx +++ b/src/IconCell/IconCell.tsx @@ -3,7 +3,7 @@ import React from 'react'; import { type IconDefinition } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { useDeprecationWarning } from 'src/utils'; +import { useDeprecationWarning } from '../utils'; import './IconCell.scss'; diff --git a/src/LoadingOverlay/LoadingOverlay.tsx b/src/LoadingOverlay/LoadingOverlay.tsx index 2c99e391..a64d1f0a 100644 --- a/src/LoadingOverlay/LoadingOverlay.tsx +++ b/src/LoadingOverlay/LoadingOverlay.tsx @@ -2,7 +2,7 @@ import React from 'react'; import classNames from 'classnames'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSpinnerThird } from '@fortawesome/pro-solid-svg-icons'; +import { faSpinnerThird } from '../font_awesome/solid'; import './LoadingOverlay.scss'; diff --git a/src/Modal/ModalHeader.tsx b/src/Modal/ModalHeader.tsx index 75e05814..6df2b131 100644 --- a/src/Modal/ModalHeader.tsx +++ b/src/Modal/ModalHeader.tsx @@ -3,7 +3,7 @@ import classNames from 'classnames'; import './ModalHeader.scss'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faExclamationTriangle } from '@fortawesome/pro-solid-svg-icons'; +import { faExclamationTriangle } from '../font_awesome/solid'; type ModalHeaderProps = { children?: React.ReactNode; diff --git a/src/Pill/Pill.stories.tsx b/src/Pill/Pill.stories.tsx index 305f7215..33f1bca0 100644 --- a/src/Pill/Pill.stories.tsx +++ b/src/Pill/Pill.stories.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { action } from '@storybook/addon-actions'; import { faClock, faGiftCard, faGlobe, faMicrophone, faUsers, -} from '@fortawesome/pro-solid-svg-icons'; +} from '../font_awesome/solid'; import { Pill, Pills, PILL_COLORS } from '.'; import mdx from './Pill.mdx'; diff --git a/src/Pill/Pill.tsx b/src/Pill/Pill.tsx index 3b3e866c..8db74cbf 100644 --- a/src/Pill/Pill.tsx +++ b/src/Pill/Pill.tsx @@ -1,8 +1,8 @@ import React from 'react'; import classNames from 'classnames'; -import { type IconDefinition } from '@fortawesome/pro-solid-svg-icons'; +import { type IconDefinition } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faTimes } from '@fortawesome/pro-solid-svg-icons'; +import { faTimes } from '../font_awesome/solid'; import './Pill.scss'; diff --git a/src/ProfileCell/ProfileCell.stories.tsx b/src/ProfileCell/ProfileCell.stories.tsx index 6e783708..6b99b8b8 100644 --- a/src/ProfileCell/ProfileCell.stories.tsx +++ b/src/ProfileCell/ProfileCell.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { faShieldCheck } from '@fortawesome/pro-solid-svg-icons'; +import { faShieldCheck } from '../font_awesome/solid'; import ProfileCell from '.'; import ProfileCellSkeleton from './ProfileCellSkeleton'; import mdx from './ProfileCell.mdx'; diff --git a/src/RichTextEditor/RichTextEditorMenuBar.tsx b/src/RichTextEditor/RichTextEditorMenuBar.tsx index 49bdbf76..a8e8c012 100644 --- a/src/RichTextEditor/RichTextEditorMenuBar.tsx +++ b/src/RichTextEditor/RichTextEditorMenuBar.tsx @@ -12,7 +12,7 @@ import { faListOl, faListUl, faUnlink, -} from '@fortawesome/pro-regular-svg-icons'; +} from '../font_awesome/regular'; import IconButton from '../IconButton'; import { RichTextEditorActions } from './richTextEditorActions'; diff --git a/src/Table/Table.stories.tsx b/src/Table/Table.stories.tsx index d60518df..694bb878 100644 --- a/src/Table/Table.stories.tsx +++ b/src/Table/Table.stories.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; -import { faFileAlt, faEllipsisV, faThumbtack } from '@fortawesome/pro-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faFileAlt, faEllipsisV, faThumbtack } from '../font_awesome/solid'; import Button from '../Button'; import Card from '../Card'; import CheckboxButton from '../CheckboxButton'; diff --git a/src/Table/TableSortLabel.tsx b/src/Table/TableSortLabel.tsx index cc15a788..da841d5b 100644 --- a/src/Table/TableSortLabel.tsx +++ b/src/Table/TableSortLabel.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faSort } from '@fortawesome/pro-solid-svg-icons'; +import { faSort } from '../font_awesome/solid'; import './TableSortLabel.scss'; diff --git a/src/Tooltip/Tooltip.jsx b/src/Tooltip/Tooltip.jsx index ed5cdd33..25b7f51b 100644 --- a/src/Tooltip/Tooltip.jsx +++ b/src/Tooltip/Tooltip.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import classNames from 'classnames'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { faQuestionCircle } from '@fortawesome/pro-solid-svg-icons'; +import { faQuestionCircle } from '../font_awesome/solid'; import Popper from '../Popper'; diff --git a/src/Tooltip/Tooltip.stories.jsx b/src/Tooltip/Tooltip.stories.jsx index 362dc6e1..9be566d4 100644 --- a/src/Tooltip/Tooltip.stories.jsx +++ b/src/Tooltip/Tooltip.stories.jsx @@ -1,7 +1,7 @@ import React from 'react'; import { action } from '@storybook/addon-actions'; -import { faExclamationTriangle } from '@fortawesome/pro-solid-svg-icons'; +import { faExclamationTriangle } from '../font_awesome/solid'; import Tooltip from '.'; import mdx from './Tooltip.mdx'; diff --git a/src/font_awesome/brands.ts b/src/font_awesome/brands.ts new file mode 100644 index 00000000..e332239e --- /dev/null +++ b/src/font_awesome/brands.ts @@ -0,0 +1,19 @@ +// Keep this eslint-disable here. FontAwesome imports should only be happening +// in this file and nowhere else in the codebase. +// +// Any direct import from '@fortawesome/free-brands-svg-icons' will create bloat in +// our overall bundle size. + +/* eslint-disable no-restricted-imports */ + +import { faGoogle } from '@fortawesome/free-brands-svg-icons/faGoogle'; +import { faFacebook } from '@fortawesome/free-brands-svg-icons/faFacebook'; +import { faLinkedin } from '@fortawesome/free-brands-svg-icons/faLinkedin'; +import { faTwitter } from '@fortawesome/free-brands-svg-icons/faTwitter'; + +export { + faGoogle, + faFacebook, + faLinkedin, + faTwitter, +}; diff --git a/src/font_awesome/regular.ts b/src/font_awesome/regular.ts new file mode 100644 index 00000000..fbc053ae --- /dev/null +++ b/src/font_awesome/regular.ts @@ -0,0 +1,71 @@ +// Keep this eslint-disable here. FontAwesome imports should only be happening +// in this file and nowhere else in the codebase. +// +// Any direct import from '@fortawesome/pro-regular-svg-icons' will create bloat in +// our overall bundle size. + +/* eslint-disable no-restricted-imports */ + +import { faSpinnerThird } from '@fortawesome/pro-regular-svg-icons/faSpinnerThird'; +import { faCreditCard } from '@fortawesome/pro-regular-svg-icons/faCreditCard'; +import { faFileAlt } from '@fortawesome/pro-regular-svg-icons/faFileAlt'; +import { faCaretDown } from '@fortawesome/pro-regular-svg-icons/faCaretDown'; +import { faPaperPlane } from '@fortawesome/pro-regular-svg-icons/faPaperPlane'; +import { faCopy } from '@fortawesome/pro-regular-svg-icons/faCopy'; +import { faCalendarAlt } from '@fortawesome/pro-regular-svg-icons/faCalendarAlt'; +import { faEllipsisV } from '@fortawesome/pro-regular-svg-icons/faEllipsisV'; +import { faChevronDown } from '@fortawesome/pro-regular-svg-icons/faChevronDown'; +import { faTag } from '@fortawesome/pro-regular-svg-icons/faTag'; +import { faEnvelope } from '@fortawesome/pro-regular-svg-icons/faEnvelope'; +import { faTrashAlt } from '@fortawesome/pro-regular-svg-icons/faTrashAlt'; +import { faPlus } from '@fortawesome/pro-regular-svg-icons/faPlus'; +import { faPlusCircle } from '@fortawesome/pro-regular-svg-icons/faPlusCircle'; +import { faMinusCircle } from '@fortawesome/pro-regular-svg-icons/faMinusCircle'; +import { faChevronLeft } from '@fortawesome/pro-regular-svg-icons/faChevronLeft'; +import { faChevronRight } from '@fortawesome/pro-regular-svg-icons/faChevronRight'; +import { faPencil } from '@fortawesome/pro-regular-svg-icons/faPencil'; +import { faTimes } from '@fortawesome/pro-regular-svg-icons/faTimes'; +import { faExpandAlt } from '@fortawesome/pro-regular-svg-icons/faExpandAlt'; +import { faGlobe } from '@fortawesome/pro-regular-svg-icons/faGlobe'; +import { faMailbox } from '@fortawesome/pro-regular-svg-icons/faMailbox'; +import { faStar } from '@fortawesome/pro-regular-svg-icons/faStar'; +import { faUser } from '@fortawesome/pro-regular-svg-icons/faUser'; +import { faBold } from '@fortawesome/pro-regular-svg-icons/faBold'; +import { faItalic } from '@fortawesome/pro-regular-svg-icons/faItalic'; +import { faLink } from '@fortawesome/pro-regular-svg-icons/faLink'; +import { faListOl } from '@fortawesome/pro-regular-svg-icons/faListOl'; +import { faListUl } from '@fortawesome/pro-regular-svg-icons/faListUl'; +import { faUnlink } from '@fortawesome/pro-regular-svg-icons/faUnlink'; + +export { + faSpinnerThird, + faCreditCard, + faFileAlt, + faCaretDown, + faPaperPlane, + faCopy, + faCalendarAlt, + faEllipsisV, + faChevronDown, + faTag, + faEnvelope, + faTrashAlt, + faPlus, + faPlusCircle, + faMinusCircle, + faChevronLeft, + faChevronRight, + faPencil, + faTimes, + faExpandAlt, + faGlobe, + faMailbox, + faStar, + faUser, + faBold, + faItalic, + faLink, + faListOl, + faListUl, + faUnlink, +}; diff --git a/src/font_awesome/solid.ts b/src/font_awesome/solid.ts new file mode 100644 index 00000000..8e10c021 --- /dev/null +++ b/src/font_awesome/solid.ts @@ -0,0 +1,63 @@ +// Keep this eslint-disable here. FontAwesome imports should only be happening +// in this file and nowhere else in the codebase. +// +// Any direct import from '@fortawesome/pro-solid-svg-icons' will create bloat in +// our overall bundle size. + +/* eslint-disable no-restricted-imports */ + +import { faChevronUp } from '@fortawesome/pro-solid-svg-icons/faChevronUp'; +import { faBullhorn } from '@fortawesome/pro-solid-svg-icons/faBullhorn'; +import { faCircle } from '@fortawesome/pro-solid-svg-icons/faCircle'; +import { faCheck } from '@fortawesome/pro-solid-svg-icons/faCheck'; +import { faExclamationTriangle } from '@fortawesome/pro-solid-svg-icons/faExclamationTriangle'; +import { faInfo } from '@fortawesome/pro-solid-svg-icons/faInfo'; +import { faTimes } from '@fortawesome/pro-solid-svg-icons/faTimes'; +import { faEnvelope } from '@fortawesome/pro-solid-svg-icons/faEnvelope'; +import { faChevronLeft } from '@fortawesome/pro-solid-svg-icons/faChevronLeft'; +import { faChevronRight } from '@fortawesome/pro-solid-svg-icons/faChevronRight'; +import { faTrash } from '@fortawesome/pro-solid-svg-icons/faTrash'; +import { faCompressAlt } from '@fortawesome/pro-solid-svg-icons/faCompressAlt'; +import { faExpandAlt } from '@fortawesome/pro-solid-svg-icons/faExpandAlt'; +import { faSearch } from '@fortawesome/pro-solid-svg-icons/faSearch'; +import { faSpinnerThird } from '@fortawesome/pro-solid-svg-icons/faSpinnerThird'; +import { faClock } from '@fortawesome/pro-solid-svg-icons/faClock'; +import { faGiftCard } from '@fortawesome/pro-solid-svg-icons/faGiftCard'; +import { faGlobe } from '@fortawesome/pro-solid-svg-icons/faGlobe'; +import { faMicrophone } from '@fortawesome/pro-solid-svg-icons/faMicrophone'; +import { faUsers } from '@fortawesome/pro-solid-svg-icons/faUsers'; +import { faShieldCheck } from '@fortawesome/pro-solid-svg-icons/faShieldCheck'; +import { faFileAlt } from '@fortawesome/pro-solid-svg-icons/faFileAlt'; +import { faEllipsisV } from '@fortawesome/pro-solid-svg-icons/faEllipsisV'; +import { faThumbtack } from '@fortawesome/pro-solid-svg-icons/faThumbtack'; +import { faSort } from '@fortawesome/pro-solid-svg-icons/faSort'; +import { faQuestionCircle } from '@fortawesome/pro-solid-svg-icons/faQuestionCircle'; + +export { + faChevronUp, + faBullhorn, + faCircle, + faCheck, + faExclamationTriangle, + faInfo, + faTimes, + faEnvelope, + faChevronLeft, + faChevronRight, + faTrash, + faCompressAlt, + faExpandAlt, + faSearch, + faSpinnerThird, + faClock, + faGiftCard, + faGlobe, + faMicrophone, + faUsers, + faShieldCheck, + faFileAlt, + faEllipsisV, + faThumbtack, + faSort, + faQuestionCircle, +};