@thecb/components 8.0.4-beta.7 → 8.0.4-beta.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -1,5 +1,5 @@
1
1
  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';
2
- import styled, { ThemeContext, css as css$1, ThemeProvider, keyframes as keyframes$3 } from 'styled-components';
2
+ import styled, { ThemeContext, css, ThemeProvider, keyframes as keyframes$3 } from 'styled-components';
3
3
  import theme from 'styled-theming';
4
4
  import { Link, useNavigate, useLocation } from 'react-router-dom';
5
5
  import reactDom from 'react-dom';
@@ -5187,11 +5187,11 @@ var TextSpan = styled.span.withConfig({
5187
5187
  return $textWrap ? "initial" : "nowrap";
5188
5188
  }, function (_ref6) {
5189
5189
  var hoverStyles = _ref6.hoverStyles;
5190
- return css$1(["", ""], hoverStyles);
5190
+ return css(["", ""], hoverStyles);
5191
5191
  }, ROYAL_BLUE, function (_ref7) {
5192
5192
  var disabled = _ref7.disabled,
5193
5193
  disabledStyles = _ref7.disabledStyles;
5194
- return disabled && css$1(["", ""], disabledStyles);
5194
+ return disabled && css(["", ""], disabledStyles);
5195
5195
  }, function (_ref8) {
5196
5196
  var extraStyles = _ref8.extraStyles;
5197
5197
  return extraStyles;
@@ -6488,27 +6488,27 @@ var BoxWrapper = styled(function (_ref) {
6488
6488
  var hoverStyles = _ref14.hoverStyles,
6489
6489
  as = _ref14.as,
6490
6490
  disabled = _ref14.disabled;
6491
- return css$1(["", " ", ""], hoverStyles, as === "button" && !disabled ? "> * > span {\n ".concat(hoverStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6491
+ return css(["", " ", ""], hoverStyles, as === "button" && !disabled ? "> * > span {\n ".concat(hoverStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6492
6492
  }, function (_ref15) {
6493
6493
  var as = _ref15.as;
6494
- return css$1(["outline:3px solid ", ";outline-offset:2px;", ""], ROYAL_BLUE, as === "button" && "\n > * > span {\n border: none;\n outline: none;\n box-shadow: none;\n }");
6494
+ return css(["outline:3px solid ", ";outline-offset:2px;", ""], ROYAL_BLUE, as === "button" && "\n > * > span {\n border: none;\n outline: none;\n box-shadow: none;\n }");
6495
6495
  }, function (_ref16) {
6496
6496
  var activeStyles = _ref16.activeStyles,
6497
6497
  as = _ref16.as;
6498
- return css$1(["", " ", ""], activeStyles, as === "button" ? " > * > span {\n ".concat(activeStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6498
+ return css(["", " ", ""], activeStyles, as === "button" ? " > * > span {\n ".concat(activeStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6499
6499
  }, function (_ref17) {
6500
6500
  var disabledStyles = _ref17.disabledStyles,
6501
6501
  as = _ref17.as;
6502
- return css$1(["", " ", ""], disabledStyles, as === "button" ? " > * > span {\n ".concat(disabledStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6502
+ return css(["", " ", ""], disabledStyles, as === "button" ? " > * > span {\n ".concat(disabledStyles, "\n border: none;\n outline: none;\n box-shadow: none;\n }") : "");
6503
6503
  }, function (_ref18) {
6504
6504
  var color = _ref18.color;
6505
6505
  return color;
6506
6506
  }, function (_ref19) {
6507
6507
  var hiddenStyles = _ref19.hiddenStyles;
6508
- return hiddenStyles && css$1(["display:none;"]);
6508
+ return hiddenStyles && css(["display:none;"]);
6509
6509
  }, function (_ref20) {
6510
6510
  var extraStyles = _ref20.extraStyles;
6511
- return css$1(["", ""], extraStyles);
6511
+ return css(["", ""], extraStyles);
6512
6512
  });
6513
6513
  /* eslint-enable no-unused-vars */
6514
6514
 
@@ -6877,7 +6877,6 @@ var Sidebar = function Sidebar(_ref) {
6877
6877
  }, safeChildren(children, /*#__PURE__*/React.createElement(Fragment$1, null))));
6878
6878
  };
6879
6879
 
6880
- var _templateObject;
6881
6880
  var StackWrapper = styled.div.withConfig({
6882
6881
  displayName: "Stackstyled__StackWrapper",
6883
6882
  componentId: "sc-ejhezz-0"
@@ -6900,7 +6899,7 @@ var StackWrapper = styled.div.withConfig({
6900
6899
  return bottomItem ? "\n > :nth-child(".concat(bottomItem, ") {\n ").concat(direction === "row" ? "margin-left: auto;" : "margin-top: auto;", "\n }\n ") : "";
6901
6900
  }, function (_ref6) {
6902
6901
  var hoverStyles = _ref6.hoverStyles;
6903
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n "])), hoverStyles);
6902
+ return css(["", ""], hoverStyles);
6904
6903
  });
6905
6904
 
6906
6905
  var _excluded$a = ["childGap", "bottomItem", "fullHeight", "children", "direction", "justify", "hoverStyles"];
@@ -6932,7 +6931,8 @@ var Stack = function Stack(_ref) {
6932
6931
  bottomItem: bottomItem,
6933
6932
  fullHeight: fullHeight,
6934
6933
  direction: direction,
6935
- justify: justify
6934
+ justify: justify,
6935
+ hoverStyles: hoverStyles
6936
6936
  }, rest), safeChildren(children, /*#__PURE__*/React.createElement(Fragment$1, null)));
6937
6937
  };
6938
6938
 
@@ -7076,7 +7076,7 @@ var SwitcherInnerContainer = styled.div.withConfig({
7076
7076
  return maxChildren ? "> :nth-last-child(".concat(maxChildren + 1, "), > :nth-last-child(").concat(maxChildren + 1, ") ~ * {\n flex-basis: 100%;\n }") : "";
7077
7077
  }, function (_ref9) {
7078
7078
  var extraStyles = _ref9.extraStyles;
7079
- return css$1(["", ""], extraStyles);
7079
+ return css(["", ""], extraStyles);
7080
7080
  });
7081
7081
 
7082
7082
  var _excluded$d = ["breakpoint", "childGap", "largeChild", "largeChildSize", "maxChildren", "maxChildrenOnly", "padding", "children", "extraStyles", "constrainMobile"];
@@ -21810,7 +21810,7 @@ var CheckboxIcon = styled.svg.withConfig({
21810
21810
  var disabled = _ref.disabled,
21811
21811
  disabledCheckColor = _ref.disabledCheckColor,
21812
21812
  checkColor = _ref.checkColor;
21813
- return disabled ? css$1(["", ""], disabledCheckColor) : css$1(["", ""], checkColor);
21813
+ return disabled ? css(["", ""], disabledCheckColor) : css(["", ""], checkColor);
21814
21814
  });
21815
21815
  var HiddenCheckbox = styled.input.attrs({
21816
21816
  type: "checkbox"
@@ -21835,7 +21835,7 @@ var StyledCheckbox = styled.div.withConfig({
21835
21835
  errorStyles = _ref3.errorStyles,
21836
21836
  disabledStyles = _ref3.disabledStyles,
21837
21837
  disabledCheckedStyles = _ref3.disabledCheckedStyles;
21838
- return error ? css$1(["", " ", ""], errorStyles, focused && focusedStyles) : disabled ? css$1(["", ""], checked ? disabledCheckedStyles : disabledStyles) : checked ? css$1(["", " ", ""], checkedStyles, focused && focusedStyles) : css$1(["", " ", ""], defaultStyles, focused && focusedStyles);
21838
+ return error ? css(["", " ", ""], errorStyles, focused && focusedStyles) : disabled ? css(["", ""], checked ? disabledCheckedStyles : disabledStyles) : checked ? css(["", " ", ""], checkedStyles, focused && focusedStyles) : css(["", " ", ""], defaultStyles, focused && focusedStyles);
21839
21839
  });
21840
21840
 
21841
21841
  var Checkbox = function Checkbox(_ref4) {
@@ -25613,10 +25613,10 @@ var InputField = styled.input.withConfig({
25613
25613
  return background && "background: ".concat(themeValues.inputBackgroundColor, " url(").concat(background, ") no-repeat right 0.5rem center;");
25614
25614
  }, ROYAL_BLUE, function (_ref6) {
25615
25615
  var disabled = _ref6.disabled;
25616
- return disabled && css$1(["color:#6e727e;background-color:#f7f7f7;"]);
25616
+ return disabled && css(["color:#6e727e;background-color:#f7f7f7;"]);
25617
25617
  }, function (_ref7) {
25618
25618
  var $extraStyles = _ref7.$extraStyles;
25619
- return css$1(["", ""], $extraStyles);
25619
+ return css(["", ""], $extraStyles);
25620
25620
  }); // eslint-disable-next-line no-unused-vars
25621
25621
 
25622
25622
  var FormattedInputField = styled(function (_ref8) {
@@ -25644,10 +25644,10 @@ var FormattedInputField = styled(function (_ref8) {
25644
25644
  return themeValues.color && themeValues.color;
25645
25645
  }, ROYAL_BLUE, function (_ref13) {
25646
25646
  var disabled = _ref13.disabled;
25647
- return disabled && css$1(["color:#6e727e;background-color:#f7f7f7;"]);
25647
+ return disabled && css(["color:#6e727e;background-color:#f7f7f7;"]);
25648
25648
  }, function (_ref14) {
25649
25649
  var extraStyles = _ref14.extraStyles;
25650
- return css$1(["", ""], extraStyles);
25650
+ return css(["", ""], extraStyles);
25651
25651
  });
25652
25652
 
25653
25653
  var FormInput = function FormInput(_ref15) {
@@ -26361,7 +26361,7 @@ var SpinnerSvgAnimation = styled.svg.withConfig({
26361
26361
  return color;
26362
26362
  }, function (_ref4) {
26363
26363
  var centerSpinner = _ref4.centerSpinner;
26364
- return centerSpinner ? css$1(["margin:0;"]) : "";
26364
+ return centerSpinner ? css(["margin:0;"]) : "";
26365
26365
  });
26366
26366
  var SpinnerContainer$2 = styled.div.withConfig({
26367
26367
  displayName: "Spinner__SpinnerContainer",
@@ -26369,7 +26369,7 @@ var SpinnerContainer$2 = styled.div.withConfig({
26369
26369
  })(["width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;line-height:1;", ""], function (_ref5) {
26370
26370
  var centerSpinner = _ref5.centerSpinner,
26371
26371
  size = _ref5.size;
26372
- return centerSpinner ? css$1(["width:", "px;height:", "px;"], size, size) : "";
26372
+ return centerSpinner ? css(["width:", "px;height:", "px;"], size, size) : "";
26373
26373
  });
26374
26374
  /*
26375
26375
  `centerSpinner` prop alters existing styling of spinner to allow it to properly center itself within
@@ -26499,7 +26499,7 @@ var NavHeader = function NavHeader(_ref) {
26499
26499
  }, rightContent))))));
26500
26500
  };
26501
26501
 
26502
- var _templateObject$1, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _DEFAULT_ERROR_MESSAG;
26502
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _DEFAULT_ERROR_MESSAG;
26503
26503
 
26504
26504
  var MIN_LENGTH_ERROR = "error/HAS_LENGTH";
26505
26505
  var MAX_LENGTH_ERROR = "max_length_error";
@@ -26540,7 +26540,7 @@ with interpolation.
26540
26540
  */
26541
26541
 
26542
26542
 
26543
- var DEFAULT_ERROR_MESSAGES = (_DEFAULT_ERROR_MESSAG = {}, _defineProperty(_DEFAULT_ERROR_MESSAG, MIN_LENGTH_ERROR, genErrorMessage(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["", " is too short"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MAX_LENGTH_ERROR, genErrorMessage(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["", " is too long"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, EXACT_LENGTH_ERROR, genErrorMessage(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["", " is not the right length"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MULTIPLE_LENGTHS_ERROR, genErrorMessage(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["", " is not a valid length"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, EMAIL_ERROR, genErrorMessage(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["", " is not a valid email address"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_NUMBER_ERROR, genErrorMessage(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["", " needs a number"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_UPPERCASE_LETTER_ERROR, genErrorMessage(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["", " needs an uppercase letter"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_LOWERCASE_LETTER_ERROR, genErrorMessage(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["", " needs a lowercase letter"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_SPECIAL_CHARACTER_ERROR, genErrorMessage(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["", " needs a special character"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, ONLY_NUMBERS_ERROR, genErrorMessage(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["", " must be only numbers"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, ONLY_LETTERS_ERROR, genErrorMessage(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["", " must be only letters"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, REQUIRED_FIELD_ERROR, genErrorMessage(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["", " is required"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, NUM_GREATER_THAN_ERROR, genErrorMessage(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["", " is too high"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, NUM_LESS_THAN_ERROR, genErrorMessage(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["", " is too low"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MATCHES_FIELD_ERROR, genErrorMessage(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["", " must match ", ""])), "fieldLabel", "matchField")), _defineProperty(_DEFAULT_ERROR_MESSAG, VALID_SELECT_OPTION_ERROR, genErrorMessage(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["", " is not a valid option"])), "fieldLabel")), _DEFAULT_ERROR_MESSAG); // Constants to represent an input's state
26543
+ var DEFAULT_ERROR_MESSAGES = (_DEFAULT_ERROR_MESSAG = {}, _defineProperty(_DEFAULT_ERROR_MESSAG, MIN_LENGTH_ERROR, genErrorMessage(_templateObject || (_templateObject = _taggedTemplateLiteral(["", " is too short"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MAX_LENGTH_ERROR, genErrorMessage(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["", " is too long"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, EXACT_LENGTH_ERROR, genErrorMessage(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["", " is not the right length"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MULTIPLE_LENGTHS_ERROR, genErrorMessage(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["", " is not a valid length"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, EMAIL_ERROR, genErrorMessage(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["", " is not a valid email address"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_NUMBER_ERROR, genErrorMessage(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["", " needs a number"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_UPPERCASE_LETTER_ERROR, genErrorMessage(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["", " needs an uppercase letter"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_LOWERCASE_LETTER_ERROR, genErrorMessage(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["", " needs a lowercase letter"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, HAS_SPECIAL_CHARACTER_ERROR, genErrorMessage(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["", " needs a special character"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, ONLY_NUMBERS_ERROR, genErrorMessage(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["", " must be only numbers"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, ONLY_LETTERS_ERROR, genErrorMessage(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["", " must be only letters"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, REQUIRED_FIELD_ERROR, genErrorMessage(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["", " is required"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, NUM_GREATER_THAN_ERROR, genErrorMessage(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["", " is too high"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, NUM_LESS_THAN_ERROR, genErrorMessage(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["", " is too low"])), "fieldLabel")), _defineProperty(_DEFAULT_ERROR_MESSAG, MATCHES_FIELD_ERROR, genErrorMessage(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["", " must match ", ""])), "fieldLabel", "matchField")), _defineProperty(_DEFAULT_ERROR_MESSAG, VALID_SELECT_OPTION_ERROR, genErrorMessage(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["", " is not a valid option"])), "fieldLabel")), _DEFAULT_ERROR_MESSAG); // Constants to represent an input's state
26544
26544
  // Neutral - has not been validated
26545
26545
  // Invalid - has been validated and has an error
26546
26546
  // Valid - has been validated and has no error