Merge pull request #1137 from appfolio/debt-270-add-fa-brands-to-react-gears-iconstyle

270 react-gears - add icon style to include cc brands

Author: emcpete

src/components/Icon/FontAwesomeAPM.tsx

@@ -28,7 +28,7 @@ export interface FontAwesomeAPMProps extends React.HTMLAttributes<any> {
   spin?: boolean;
   stack?: '1x' | '2x';
   tag?: keyof JSX.IntrinsicElements;
-  iconStyle?: 'regular' | 'solid' | 'thin' | 'light' | 'duotone';
+  iconStyle?: 'regular' | 'solid' | 'thin' | 'light' | 'duotone' | 'brands';
 }
 
 /**

src/components/Icon/Icon.stories.js

@@ -21,7 +21,11 @@ export const LiveExample = () => (
     rotate={select('rotate', ['', '90', '180', '270'], '')}
     flip={select('flip', ['', 'horizontal', 'vertical'], '')}
     border={boolean('border', false)}
-    iconStyle={select('iconStyle', ['regular', 'solid', 'thin', 'light', 'duotone'], 'solid')}
+    iconStyle={select(
+      'iconStyle',
+      ['regular', 'solid', 'thin', 'light', 'duotone', 'brands'],
+      'solid'
+    )}
   />
 );
 

src/components/Input/CreditCardNumber.tsx

@@ -89,12 +89,18 @@ const CreditCardNumber: FC<CreditCardNumberProps> = ({
   const { type, value, ...inputProps } = props;
 
   const ccType = getType(value);
+  const ccIconName = typeToIconName(ccType);
 
   return (
     <InputGroup className={className}>
       <Input value={value || ''} onChange={onChangeHandler} {...inputProps} />
       <InputGroupText className="p-0 px-2">
-        <Icon name={typeToIconName(ccType)} iconStyle="regular" fixedWidth size="lg" />
+        <Icon
+          name={ccIconName}
+          iconStyle={ccIconName === 'credit-card' ? 'regular' : 'brands'}
+          fixedWidth
+          size="lg"
+        />
       </InputGroupText>
     </InputGroup>
   );

storybook-static/0.9c000ad5.iframe.bundle.js

@@ -0,0 +1,8 @@
+/**
+   * Prism: Lightweight, robust, elegant syntax highlighting
+   *
+   * @license MIT <https://opensource.org/licenses/MIT>
+   * @author Lea Verou <https://lea.verou.me>
+   * @namespace
+   * @public
+   */

storybook-static/0.fb776b5f1335c2d06199.manager.bundle.js

@@ -0,0 +1,11 @@
+/*! axe v4.4.3
+ * Copyright (c) 2022 Deque Systems, Inc.
+ *
+ * Your use of this Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * This entire copyright notice must appear in every copy of this file you
+ * distribute or in any file that contains substantial portions of this source
+ * code.
+ */

storybook-static/0.fb776b5f1335c2d06199.manager.bundle.js.LICENSE.txt

@@ -0,0 +1,31 @@
+/**
+    	 * @license
+    	 * Copyright Google Inc. All Rights Reserved.
+    	 *
+    	 * Use of this source code is governed by an MIT-style license that can be
+    	 * found in the LICENSE file at https://angular.io/license
+    	 */
+
+/**
+      	   * @license
+      	   * Copyright Google Inc. All Rights Reserved.
+      	   *
+      	   * Use of this source code is governed by an MIT-style license that can be
+      	   * found in the LICENSE file at https://angular.io/license
+      	   */
+
+/**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+
+/**
+   * @license
+   * Copyright Google Inc. All Rights Reserved.
+   *
+   * Use of this source code is governed by an MIT-style license that can be
+   * found in the LICENSE file at https://angular.io/license
+   */

storybook-static/1.b6076b2cf00d42270d75.manager.bundle.js

@@ -0,0 +1,12 @@
+/*!
+ * OverlayScrollbars
+ * https://github.com/KingSora/OverlayScrollbars
+ *
+ * Version: 1.13.0
+ *
+ * Copyright KingSora | Rene Haas.
+ * https://github.com/KingSora
+ *
+ * Released under the MIT license.
+ * Date: 02.08.2020
+ */