@thecb/components 8.3.1-beta.4 → 8.3.1-beta.6

package/dist/index.esm.js

@@ -1,7 +1,7 @@
 import React, { createContext, createElement, PureComponent, forwardRef, Component, cloneElement, Children, useContext, Fragment as Fragment$1, useRef, useState, useLayoutEffect, memo, useEffect as useEffect$1, useMemo, useCallback, isValidElement, createRef } from 'react';
 import styled, { ThemeContext, css, ThemeProvider, keyframes as keyframes$3 } from 'styled-components';
 import theme from 'styled-theming';
-import { useMatch, Link, useNavigate, useLocation } from 'react-router-dom';
+import { Link, useMatch, useNavigate, useLocation } from 'react-router-dom';
 import reactDom from 'react-dom';
 
 function ownKeys(object, enumerableOnly) {
@@ -19706,13 +19706,11 @@ var fontFamily$2 = {
 };
 var hoverColor$2 = SAPPHIRE_BLUE;
 var activeColor$3 = PEACOCK_BLUE;
-var activeBackgroundColor$1 = INFO_BLUE;
 var externalLinkColor = MATISSE_BLUE;
 var fallbackValues$a = {
   fontFamily: fontFamily$2,
   hoverColor: hoverColor$2,
   activeColor: activeColor$3,
-  activeBackgroundColor: activeBackgroundColor$1,
   externalLinkColor: externalLinkColor
 };
 
@@ -19820,15 +19818,13 @@ var StyledInternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
       extrastyles = _ref.extrastyles,
       props = _objectWithoutProperties(_ref, _excluded$l);
 
-  var match = useMatch();
-  console.log("🚀 ~ file: InternalLink.styled.js:18 ~ match:", match);
   return /*#__PURE__*/React.createElement(Link, _extends({}, props, {
     ref: ref
   }));
 })).withConfig({
   displayName: "InternalLinkstyled__StyledInternalLink",
   componentId: "sc-cuqxud-0"
-})(["display:flex;color:", ";font-weight:", ";line-height:", ";font-size:", ";font-family:", ";margin:", ";background-color:", " ? 'lightblue' :'transparent',&:hover{color:", ";text-decoration:underline;}&:focus{outline:3px solid ", ";outline-offset:2px;}&:active{text-decoration:underline;color:", ";background-color:", ";}", ""], function (_ref2) {
+})(["display:flex;color:", ";font-weight:", ";line-height:", ";font-size:", ";font-family:", ";margin:", ";background-color:", ";&:hover{color:", ";text-decoration:underline;}&:focus{outline:3px solid ", ";outline-offset:2px;}&:active{text-decoration:underline;color:", ";}", ""], function (_ref2) {
   var color = _ref2.color,
       active = _ref2.active,
       activeColor = _ref2.activeColor;
@@ -19848,15 +19844,15 @@ var StyledInternalLink = styled( /*#__PURE__*/forwardRef(function (_ref, ref) {
 }, function (_ref7) {
   var margin = _ref7.margin;
   return margin;
-}, match, function (_ref8) {
-  var hoverColor = _ref8.hoverColor;
+}, function (_ref8) {
+  var match = _ref8.match;
+  return match ? INFO_BLUE : 'transparent';
+}, function (_ref9) {
+  var hoverColor = _ref9.hoverColor;
   return hoverColor;
-}, ROYAL_BLUE, function (_ref9) {
-  var activeColor = _ref9.activeColor;
+}, ROYAL_BLUE, function (_ref10) {
+  var activeColor = _ref10.activeColor;
   return activeColor;
-}, function (_ref10) {
-  var activeBackgroundColor = _ref10.activeBackgroundColor;
-  return activeBackgroundColor ? activeBackgroundColor : 'transparent';
 }, function (_ref11) {
   var extrastyles = _ref11.extrastyles;
   return extrastyles;
@@ -21509,15 +21505,11 @@ _curry2(function test(pattern, str) {
 
 var URL_TEST = /(([a-z]{3,6}:\/\/)|(^|\s))([a-zA-Z0-9\-]+\.)+[a-z]{2,13}[\.\?\=\&\%\/\w\-]*\b([^@]|$)/;
 
-var _excluded$m = ["url", "active", "activeBackgroundColor", "disabled", "fileLink", "extraStyles", "linkExtraStyles", "newTab", "dataQa"];
+var _excluded$m = ["url", "disabled", "fileLink", "extraStyles", "linkExtraStyles", "newTab", "dataQa"];
 
 var ButtonWithLink = function ButtonWithLink(_ref) {
   var _ref$url = _ref.url,
       url = _ref$url === void 0 ? "/" : _ref$url,
-      _ref$active = _ref.active,
-      active = _ref$active === void 0 ? false : _ref$active,
-      _ref$activeBackground = _ref.activeBackgroundColor,
-      activeBackgroundColor = _ref$activeBackground === void 0 ? undefined : _ref$activeBackground,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$fileLink = _ref.fileLink,
@@ -21532,12 +21524,12 @@ var ButtonWithLink = function ButtonWithLink(_ref) {
   var ButtonWithLinkWrapper = function ButtonWithLinkWrapper(_ref2) {
     var children = _ref2.children,
         url = _ref2.url,
-        active = _ref2.active,
-        activeBackgroundColor = _ref2.activeBackgroundColor,
         disabled = _ref2.disabled,
         newTab = _ref2.newTab,
         dataQa = _ref2.dataQa,
         extraStyles = _ref2.extraStyles;
+    var match = useMatch();
+    console.log("🚀 ~ file: ButtonWithLink.js:32 ~ match:", match);
 
     if (disabled) {
       return safeChildren(children, /*#__PURE__*/React.createElement("span", null));
@@ -21551,8 +21543,7 @@ var ButtonWithLink = function ButtonWithLink(_ref) {
       dataQa: dataQa
     }, safeChildren(children, /*#__PURE__*/React.createElement("span", null))) : /*#__PURE__*/React.createElement(InternalLink, {
       to: url,
-      active: active,
-      activeBackgroundColor: activeBackgroundColor,
+      match: match,
       tabIndex: "-1",
       dataQa: dataQa,
       extraStyles: extraStyles
@@ -21561,8 +21552,6 @@ var ButtonWithLink = function ButtonWithLink(_ref) {
 
   return /*#__PURE__*/React.createElement(ButtonWithLinkWrapper, {
     url: url,
-    active: active,
-    activeBackgroundColor: activeBackgroundColor,
     disabled: disabled,
     newTab: newTab,
     extraStyles: "".concat(linkExtraStyles, " text-decoration: none; &:hover {\n        text-decoration: none; }"),
@@ -22377,22 +22366,22 @@ var process$1 = global_1.process;
 var Deno = global_1.Deno;
 var versions = process$1 && process$1.versions || Deno && Deno.version;
 var v8 = versions && versions.v8;
-var match$1, version;
+var match, version;
 
 if (v8) {
-  match$1 = v8.split('.');
+  match = v8.split('.');
   // in old Chrome, versions of V8 isn't V8 = Chrome / 10
   // but their correct versions are not interesting for us
-  version = match$1[0] > 0 && match$1[0] < 4 ? 1 : +(match$1[0] + match$1[1]);
+  version = match[0] > 0 && match[0] < 4 ? 1 : +(match[0] + match[1]);
 }
 
 // BrowserFS NodeJS `process` polyfill incorrectly set `.v8` to `0.0`
 // so check `userAgent` even if `.v8` exists, but 0
 if (!version && engineUserAgent) {
-  match$1 = engineUserAgent.match(/Edge\/(\d+)/);
-  if (!match$1 || match$1[1] >= 74) {
-    match$1 = engineUserAgent.match(/Chrome\/(\d+)/);
-    if (match$1) version = +match$1[1];
+  match = engineUserAgent.match(/Edge\/(\d+)/);
+  if (!match || match[1] >= 74) {
+    match = engineUserAgent.match(/Chrome\/(\d+)/);
+    if (match) version = +match[1];
   }
 }
 
@@ -47528,11 +47517,11 @@ var createPartialAmountFormState = function createPartialAmountFormState(lineIte
 var arrowColor = WHITE;
 var numberColor = MATISSE_BLUE;
 var hoverBackgroundColor$2 = ALABASTER_WHITE;
-var activeBackgroundColor$2 = WHITE;
+var activeBackgroundColor$1 = WHITE;
 var activeColor$9 = MATISSE_BLUE;
 var fallbackValues$L = {
   activeColor: activeColor$9,
-  activeBackgroundColor: activeBackgroundColor$2,
+  activeBackgroundColor: activeBackgroundColor$1,
   arrowColor: arrowColor,
   hoverBackgroundColor: hoverBackgroundColor$2,
   numberColor: numberColor