@justfixnyc/component-library 0.32.2 → 0.33.0

package/dist/src/assets/index.css

@@ -134,26 +134,30 @@
   border-right-color: transparent;
   border-top-color: transparent;
 }
-.jfcl-button.jfcl-variant-text {
+.jfcl-button.jfcl-variant-tertiary {
   color: #242323;
   background: none;
   border: none;
   box-shadow: none;
 }
-.jfcl-button.jfcl-variant-text:disabled {
+.jfcl-button.jfcl-variant-tertiary:disabled {
   cursor: inherit;
   color: #676565;
 }
-.jfcl-button.jfcl-variant-text:disabled .jfcl-button__text {
+.jfcl-button.jfcl-variant-tertiary:disabled .jfcl-button__text {
   border-bottom: none;
 }
-.jfcl-button.jfcl-variant-text:hover:not(:disabled) {
+.jfcl-button.jfcl-variant-tertiary:hover:not(:disabled) {
   background-color: #efe9dc;
+  box-shadow: none;
+}
+.jfcl-button.jfcl-variant-tertiary:active:not(:disabled) {
+  box-shadow: none;
 }
-.jfcl-button.jfcl-variant-text.jfcl-is-loading {
+.jfcl-button.jfcl-variant-tertiary.jfcl-is-loading {
   background-color: #efe9dc;
 }
-.jfcl-button.jfcl-variant-text.jfcl-is-loading .jfcl-button__icon {
+.jfcl-button.jfcl-variant-tertiary.jfcl-is-loading .jfcl-button__icon {
   display: block;
   animation: spin 500ms infinite linear;
   position: relative;
@@ -162,7 +166,7 @@
   border-right-color: transparent;
   border-top-color: transparent;
 }
-.jfcl-button.jfcl-variant-text:active(:disabled) {
+.jfcl-button.jfcl-variant-tertiary:active(:disabled) {
   background-color: rgba(239, 233, 220, 0.8);
 }
 @keyframes spin {
@@ -273,8 +277,5 @@
   color: #676565;
 }
 .jfcl-link .jfcl-link__icon {
-  display: inline;
   margin-left: 10px;
-  width: 1rem;
-  height: 1rem;
 }

package/dist/src/assets/index.es.css

@@ -134,26 +134,30 @@
   border-right-color: transparent;
   border-top-color: transparent;
 }
-.jfcl-button.jfcl-variant-text {
+.jfcl-button.jfcl-variant-tertiary {
   color: #242323;
   background: none;
   border: none;
   box-shadow: none;
 }
-.jfcl-button.jfcl-variant-text:disabled {
+.jfcl-button.jfcl-variant-tertiary:disabled {
   cursor: inherit;
   color: #676565;
 }
-.jfcl-button.jfcl-variant-text:disabled .jfcl-button__text {
+.jfcl-button.jfcl-variant-tertiary:disabled .jfcl-button__text {
   border-bottom: none;
 }
-.jfcl-button.jfcl-variant-text:hover:not(:disabled) {
+.jfcl-button.jfcl-variant-tertiary:hover:not(:disabled) {
   background-color: #efe9dc;
+  box-shadow: none;
+}
+.jfcl-button.jfcl-variant-tertiary:active:not(:disabled) {
+  box-shadow: none;
 }
-.jfcl-button.jfcl-variant-text.jfcl-is-loading {
+.jfcl-button.jfcl-variant-tertiary.jfcl-is-loading {
   background-color: #efe9dc;
 }
-.jfcl-button.jfcl-variant-text.jfcl-is-loading .jfcl-button__icon {
+.jfcl-button.jfcl-variant-tertiary.jfcl-is-loading .jfcl-button__icon {
   display: block;
   animation: spin 500ms infinite linear;
   position: relative;
@@ -162,7 +166,7 @@
   border-right-color: transparent;
   border-top-color: transparent;
 }
-.jfcl-button.jfcl-variant-text:active(:disabled) {
+.jfcl-button.jfcl-variant-tertiary:active(:disabled) {
   background-color: rgba(239, 233, 220, 0.8);
 }
 @keyframes spin {
@@ -273,8 +277,5 @@
   color: #676565;
 }
 .jfcl-link .jfcl-link__icon {
-  display: inline;
   margin-left: 10px;
-  width: 1rem;
-  height: 1rem;
 }

package/dist/src/index.es.js

@@ -1,6 +1,8 @@
 import _extends from '@babel/runtime/helpers/extends';
 import React, { forwardRef } from 'react';
 import classNames from 'classnames';
+import { faArrowRight, faSquareArrowUpRight } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 /**
  * Accepts all `ButtonHTMLAttributes`
@@ -81,7 +83,7 @@ const IconHamburger$2 = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/Rea
   transform: "translate(1.31046 -0.00698853)"
 })))));
 IconHamburger$2.displayName = 'IconHamburger';
-var IconLinkExternal = IconHamburger$2;
+var IconHamburger$3 = IconHamburger$2;
 
 const IconLinkInternal = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
   ref: ref
@@ -354,12 +356,14 @@ const Link = /*#__PURE__*/forwardRef((_ref, ref) => {
   return /*#__PURE__*/React.createElement("a", _extends({}, props, {
     ref: ref,
     className: linkClassNames
-  }), children, icon === 'internal' && /*#__PURE__*/React.createElement(IconLinkInternal$1, {
+  }), children, icon === 'internal' && /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowRight,
     className: "jfcl-link__icon"
-  }), icon === 'external' && /*#__PURE__*/React.createElement(IconLinkExternal, {
+  }), icon === 'external' && /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faSquareArrowUpRight,
     className: "jfcl-link__icon"
   }));
 });
 Link.displayName = 'Link';
 
-export { Alert, Button, IconCheck$1 as IconCheck, IconChevron$1 as IconChevron, IconClose$1 as IconClose, IconError$1 as IconError, IconFacebook$1 as IconFacebook, IconGlobe$1 as IconGlobe, IconHamburger$1 as IconHamburger, IconInternet$1 as IconInternet, IconLinkExternal, IconLinkInternal$1 as IconLinkInternal, IconLoading$1 as IconLoading, IconMail$1 as IconMail, IconPerson$1 as IconPerson, IconTwitter$1 as IconTwitter, Link };
+export { Alert, Button, IconCheck$1 as IconCheck, IconChevron$1 as IconChevron, IconClose$1 as IconClose, IconError$1 as IconError, IconFacebook$1 as IconFacebook, IconGlobe$1 as IconGlobe, IconHamburger$1 as IconHamburger, IconInternet$1 as IconInternet, IconHamburger$3 as IconLinkExternal, IconLinkInternal$1 as IconLinkInternal, IconLoading$1 as IconLoading, IconMail$1 as IconMail, IconPerson$1 as IconPerson, IconTwitter$1 as IconTwitter, Link };

package/dist/src/index.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _extends = require('@babel/runtime/helpers/extends');
 var React = require('react');
 var classNames = require('classnames');
+var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
+var reactFontawesome = require('@fortawesome/react-fontawesome');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -91,7 +93,7 @@ const IconHamburger$2 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE_
   transform: "translate(1.31046 -0.00698853)"
 })))));
 IconHamburger$2.displayName = 'IconHamburger';
-var IconLinkExternal = IconHamburger$2;
+var IconHamburger$3 = IconHamburger$2;
 
 const IconLinkInternal = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React__default["default"].createElement("svg", _extends__default["default"]({
   ref: ref
@@ -364,9 +366,11 @@ const Link = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   return /*#__PURE__*/React__default["default"].createElement("a", _extends__default["default"]({}, props, {
     ref: ref,
     className: linkClassNames
-  }), children, icon === 'internal' && /*#__PURE__*/React__default["default"].createElement(IconLinkInternal$1, {
+  }), children, icon === 'internal' && /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: freeSolidSvgIcons.faArrowRight,
     className: "jfcl-link__icon"
-  }), icon === 'external' && /*#__PURE__*/React__default["default"].createElement(IconLinkExternal, {
+  }), icon === 'external' && /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: freeSolidSvgIcons.faSquareArrowUpRight,
     className: "jfcl-link__icon"
   }));
 });
@@ -382,7 +386,7 @@ exports.IconFacebook = IconFacebook$1;
 exports.IconGlobe = IconGlobe$1;
 exports.IconHamburger = IconHamburger$1;
 exports.IconInternet = IconInternet$1;
-exports.IconLinkExternal = IconLinkExternal;
+exports.IconLinkExternal = IconHamburger$3;
 exports.IconLinkInternal = IconLinkInternal$1;
 exports.IconLoading = IconLoading$1;
 exports.IconMail = IconMail$1;

package/dist/typings/buttons/Button.d.ts

@@ -3,7 +3,7 @@ import './styles.scss';
 export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {
     labelText: string;
     labelIcon?: React.ElementType;
-    variant?: 'primary' | 'secondary' | 'text';
+    variant?: 'primary' | 'secondary' | 'tertiary';
     size?: 'small' | 'large';
     loading?: boolean;
     iconOnRight?: boolean;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@justfixnyc/component-library",
   "description": "JustFix Component Library",
   "license": "MIT",
-  "version": "0.32.2",
+  "version": "0.33.0",
   "main": "dist/src/index.js",
   "module": "dist/src/index.es.js",
   "files": [
@@ -28,7 +28,10 @@
     "jackspeak": "2.1.1"
   },
   "dependencies": {
-    "@babel/runtime": "^7.12.5"
+    "@babel/runtime": "^7.12.5",
+    "@fortawesome/fontawesome-svg-core": "^6.5.1",
+    "@fortawesome/free-solid-svg-icons": "^6.5.1",
+    "@fortawesome/react-fontawesome": "^0.2.0"
   },
   "peerDependencies": {
     "@lingui/cli": ">=2.9.1",