@thecb/components 3.5.11 → 3.5.12-beta.2

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.
Files changed (30) hide show
  1. package/.storybook/main.js +1 -1
  2. package/.storybook/page.js +2 -0
  3. package/dist/index.cjs.js +284 -297
  4. package/package.json +3 -3
  5. package/src/components/atoms/breadcrumb/Breadcrumb.js +4 -1
  6. package/src/components/atoms/checkbox/Checkbox.js +1 -0
  7. package/src/components/atoms/checkbox-list/CheckboxList.js +3 -1
  8. package/src/components/atoms/dropdown/Dropdown.js +3 -3
  9. package/src/components/atoms/dropdown/Dropdown.stories.js +10 -33
  10. package/src/components/atoms/form-layouts/FormInput.js +7 -4
  11. package/src/components/atoms/form-layouts/FormLayouts.stories.js +5 -5
  12. package/src/components/atoms/hamburger-button/HamburgerButton.js +4 -3
  13. package/src/components/atoms/icons/AccountsIconSmall.js +6 -13
  14. package/src/components/atoms/icons/icons.stories.js +1 -1
  15. package/src/components/atoms/layouts/Box.styled.js +1 -0
  16. package/src/components/atoms/layouts/Cluster.styled.js +5 -1
  17. package/src/components/atoms/layouts/Sidebar.styled.js +7 -1
  18. package/src/components/atoms/radio-button/RadioButton.js +1 -0
  19. package/src/components/atoms/radio-button/RadioButton.stories.js +26 -61
  20. package/src/components/atoms/toggle-switch/ToggleSwitch.js +1 -0
  21. package/src/components/atoms/toggle-switch/ToggleSwitch.stories.js +10 -51
  22. package/src/components/molecules/editable-list/EditableList.js +11 -8
  23. package/src/components/molecules/nav-menu/NavMenuDesktop.js +2 -1
  24. package/src/components/molecules/nav-menu/NavMenuMobile.js +7 -1
  25. package/src/deprecated/components/radio-button/radio-button.js +5 -1
  26. package/src/deprecated/icons/IconInvalid.js +7 -31
  27. package/src/deprecated/icons/IconNeutral.js +5 -4
  28. package/src/deprecated/icons/IconValid.js +8 -33
  29. package/src/util/general.js +10 -1
  30. package/.tool-versions +0 -1
@@ -36,7 +36,11 @@ const RadioButtonCenter = styled.div`
36
36
  RadioButtonCenter.defaultProps = defaultTheme;
37
37
 
38
38
  const RadioButton = ({ isSelected, name }) => (
39
- <RadioButtonBorder isSelected={isSelected} name={name}>
39
+ <RadioButtonBorder
40
+ isSelected={isSelected}
41
+ name={name}
42
+ aria-checked={isSelected}
43
+ >
40
44
  {isSelected && <RadioButtonCenter />}
41
45
  </RadioButtonBorder>
42
46
  );
@@ -16,47 +16,23 @@ export const IconInvalid = ({
16
16
  xmlns="http://www.w3.org/2000/svg"
17
17
  xmlnsXlink="http://www.w3.org/1999/xlink"
18
18
  style={{ margin }}
19
+ aria-label="Invalid"
19
20
  >
20
- <g
21
- id="icon-invalid-Authentication"
22
- stroke="none"
23
- strokeWidth="1"
24
- fill="none"
25
- fillRule="evenodd"
26
- >
27
- <g
28
- id="icon-invalid-00.1.0.1---HSS---Register---Already-Exists-Error"
29
- transform="translate(-538.000000, -1064.000000)"
30
- fillRule="nonzero"
31
- >
32
- <g
33
- id="icon-invalid-Password-Requirements"
34
- transform="translate(457.000000, 938.000000)"
35
- >
36
- <g
37
- id="icon-invalid-Group-2"
38
- transform="translate(81.000000, 20.000000)"
39
- >
40
- <g
41
- id="icon-invalid-PasswordVerification-Error"
42
- transform="translate(0.000000, 106.000000)"
43
- >
21
+ <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
22
+ <g transform="translate(-538.000000, -1064.000000)" fillRule="nonzero">
23
+ <g transform="translate(457.000000, 938.000000)">
24
+ <g transform="translate(81.000000, 20.000000)">
25
+ <g transform="translate(0.000000, 106.000000)">
44
26
  <circle
45
- id="icon-invalid-Oval"
46
27
  stroke={bgFill}
47
28
  fill={bgFill}
48
29
  cx="9"
49
30
  cy="9"
50
31
  r="8.5"
51
32
  ></circle>
52
- <g
53
- id="icon-invalid-Icon/Close"
54
- transform="translate(2.000000, 2.000000)"
55
- fill={iconFill}
56
- >
33
+ <g transform="translate(2.000000, 2.000000)" fill={iconFill}>
57
34
  <path
58
35
  d="M7.58333333,7.58333333 L7.58333333,11.6666667 L6.41666667,11.6666667 L6.41666667,7.58333333 L2.33333333,7.58333333 L2.33333333,6.41666667 L6.41666667,6.41666667 L6.41666667,2.33333333 L7.58333333,2.33333333 L7.58333333,6.41666667 L11.6666667,6.41666667 L11.6666667,7.58333333 L7.58333333,7.58333333 Z"
59
- id="icon-invalid-x"
60
36
  transform="translate(7.000000, 7.000000) rotate(45.000000) translate(-7.000000, -7.000000) "
61
37
  ></path>
62
38
  </g>
@@ -15,11 +15,12 @@ export const IconNeutral = ({
15
15
  xmlns="http://www.w3.org/2000/svg"
16
16
  xmlnsXlink="http://www.w3.org/1999/xlink"
17
17
  style={{ margin }}
18
+ aria-label="Neutral"
18
19
  >
19
- <g id="icon-neutral-group" fill={fill} fillRule="nonzero" stroke={fill}>
20
- <g id="icon-neutral-Group-2">
21
- <g id="icon-neutral-PasswordVerification-Empty">
22
- <circle id="icon-neutral-Oval" cx="9" cy="9" r="8.5"></circle>
20
+ <g fill={fill} fillRule="nonzero" stroke={fill}>
21
+ <g>
22
+ <g>
23
+ <circle cx="9" cy="9" r="8.5"></circle>
23
24
  </g>
24
25
  </g>
25
26
  </g>
@@ -16,32 +16,14 @@ export const IconValid = ({
16
16
  xmlns="http://www.w3.org/2000/svg"
17
17
  xmlnsXlink="http://www.w3.org/1999/xlink"
18
18
  style={{ margin }}
19
+ aria-label="Valid"
19
20
  >
20
- <g
21
- id="icon-valid-Authentication"
22
- stroke="none"
23
- strokeWidth="1"
24
- fill="none"
25
- fillRule="evenodd"
26
- >
27
- <g
28
- id="icon-valid-00.1.0.1---HSS---Register---Already-Exists-Error"
29
- transform="translate(-538.000000, -996.000000)"
30
- >
31
- <g
32
- id="icon-valid-Password-Requirements"
33
- transform="translate(457.000000, 938.000000)"
34
- >
35
- <g
36
- id="icon-valid-Group-2"
37
- transform="translate(81.000000, 20.000000)"
38
- >
39
- <g
40
- id="icon-valid-PasswordVerification-Sucess"
41
- transform="translate(0.000000, 38.000000)"
42
- >
21
+ <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
22
+ <g transform="translate(-538.000000, -996.000000)">
23
+ <g transform="translate(457.000000, 938.000000)">
24
+ <g transform="translate(81.000000, 20.000000)">
25
+ <g transform="translate(0.000000, 38.000000)">
43
26
  <circle
44
- id="icon-valid-Oval"
45
27
  stroke={bgFill}
46
28
  fill={bgFill}
47
29
  fillRule="nonzero"
@@ -49,16 +31,9 @@ export const IconValid = ({
49
31
  cy="9"
50
32
  r="8.5"
51
33
  ></circle>
52
- <g
53
- id="icon-valid-baseline-check-24px"
54
- transform="translate(2.000000, 2.000000)"
55
- >
34
+ <g transform="translate(2.000000, 2.000000)">
35
+ <polygon points="0 0 14 0 14 14 0 14"></polygon>
56
36
  <polygon
57
- id="icon-valid-Path"
58
- points="0 0 14 0 14 14 0 14"
59
- ></polygon>
60
- <polygon
61
- id="icon-valid-Path-2"
62
37
  fill={iconFill}
63
38
  points="5.25 9.4325 2.8175 7 1.98916667 7.8225 5.25 11.0833333 12.25 4.08333333 11.4275 3.26083333"
64
39
  ></polygon>
@@ -1,3 +1,4 @@
1
+ import React, { Fragment } from "react";
1
2
  import numeral from "numeral";
2
3
 
3
4
  export const noop = () => {};
@@ -9,9 +10,17 @@ export const displayCurrency = cents =>
9
10
 
10
11
  export const convertCentsToMoneyInt = n => (n / 100).toFixed(0);
11
12
 
13
+ const createUniqueId = () =>
14
+ "_" +
15
+ Math.random()
16
+ .toString(36)
17
+ .substr(2, 9);
18
+
12
19
  export const safeChildren = (children, replacement = []) => {
13
20
  if (children && children instanceof Array) {
14
- return children.map(child => (!child ? replacement : child));
21
+ return children.map(child =>
22
+ !child ? <Fragment key={createUniqueId()}>{replacement}</Fragment> : child
23
+ );
15
24
  }
16
25
  return !children ? replacement : children;
17
26
  };
package/.tool-versions DELETED
@@ -1 +0,0 @@
1
- nodejs 10.15.3