carbon-react 104.43.0 → 104.45.0

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 (21) hide show
  1. package/esm/__internal__/tooltip-provider/index.js +1 -1
  2. package/esm/components/advanced-color-picker/advanced-color-picker.style.js +2 -2
  3. package/esm/components/detail/detail.style.js +13 -24
  4. package/esm/components/help/help.component.d.ts +1 -1
  5. package/esm/components/help/help.component.js +10 -10
  6. package/esm/components/icon/icon.component.js +3 -3
  7. package/esm/components/settings-row/settings-row.style.js +3 -9
  8. package/esm/components/simple-color-picker/simple-color-input/simple-color-input.style.js +1 -1
  9. package/esm/components/simple-color-picker/tick-icon/tick-icon.style.js +2 -2
  10. package/esm/components/tooltip/tooltip.component.js +1 -1
  11. package/lib/__internal__/tooltip-provider/index.js +1 -1
  12. package/lib/components/advanced-color-picker/advanced-color-picker.style.js +2 -2
  13. package/lib/components/detail/detail.style.js +13 -24
  14. package/lib/components/help/help.component.d.ts +1 -1
  15. package/lib/components/help/help.component.js +11 -10
  16. package/lib/components/icon/icon.component.js +3 -3
  17. package/lib/components/settings-row/settings-row.style.js +3 -9
  18. package/lib/components/simple-color-picker/simple-color-input/simple-color-input.style.js +1 -1
  19. package/lib/components/simple-color-picker/tick-icon/tick-icon.style.js +2 -2
  20. package/lib/components/tooltip/tooltip.component.js +1 -1
  21. package/package.json +1 -1
package/esm/__internal__/tooltip-provider/index.js CHANGED
@@ -6,7 +6,7 @@ export const TooltipProvider = ({
6
6
  children,
7
7
  tooltipPosition,
8
8
  helpAriaLabel,
9
- focusable = true,
9
+ focusable,
10
10
  tooltipVisible,
11
11
  disabled,
12
12
  target
package/esm/components/advanced-color-picker/advanced-color-picker.style.js CHANGED
@@ -41,7 +41,7 @@ const StyledAdvancedColorPickerPreview = styled.div`
41
41
  `;
42
42
  const DialogStyle = styled(Dialog)`
43
43
  ${DialogContentStyle} {
44
- padding: 18px 18px 18px 17px;
44
+ padding: var(--spacing200);
45
45
  }
46
46
 
47
47
  ${DialogInnerContentStyle} {
@@ -72,7 +72,7 @@ const DialogStyle = styled(Dialog)`
72
72
  }
73
73
 
74
74
  [data-component="icon"] {
75
- color: var(--colorsActionMinorYin065);
75
+ color: var(--colorsActionMinor500);
76
76
  }
77
77
  `;
78
78
  export { StyledAdvancedColorPickerWrapper, StyledAdvancedColorPickerCell, StyledAdvancedColorPickerPreview, DialogStyle };
package/esm/components/detail/detail.style.js CHANGED
@@ -27,30 +27,25 @@ const StyledDetailContent = styled.div`
27
27
  `}
28
28
  `;
29
29
  const StyledDetailIcon = styled(Icon)`
30
- ${({
31
- theme
32
- }) => css`
33
- position: absolute;
34
- color: ${theme.palette.slateTint(50)};
30
+ position: absolute;
31
+ color: var(--colorsUtilityYin065);
32
+ height: ${iconSize};
33
+ width: ${iconSize};
34
+ top: -1px;
35
+ vertical-align: top;
36
+
37
+ // StyledSvgIcon
38
+ span {
35
39
  height: ${iconSize};
36
40
  width: ${iconSize};
37
- top: -1px;
38
- vertical-align: top;
39
-
40
- // StyledSvgIcon
41
- span {
42
- height: ${iconSize};
43
- width: ${iconSize};
44
- vertical-align: middle;
45
- }
46
- `}
41
+ vertical-align: middle;
42
+ }
47
43
  `;
48
44
  const StyledDetailFootnote = styled.div`
49
45
  ${({
50
- hasIcon,
51
- theme
46
+ hasIcon
52
47
  }) => css`
53
- color: ${theme.palette.slateTint(20)};
48
+ color: var(--colorsUtilityYin055);
54
49
  font-size: 13px;
55
50
  position: relative;
56
51
  margin-top: -2px;
@@ -63,10 +58,4 @@ const StyledDetailFootnote = styled.div`
63
58
  StyledDetail.defaultProps = {
64
59
  theme: baseTheme
65
60
  };
66
- StyledDetailIcon.defaultProps = {
67
- theme: baseTheme
68
- };
69
- StyledDetailFootnote.defaultProps = {
70
- theme: baseTheme
71
- };
72
61
  export { StyledDetail, StyledDetailContent, StyledDetailIcon, StyledDetailFootnote };
package/esm/components/help/help.component.d.ts CHANGED
@@ -14,7 +14,7 @@ declare function Help({ className, href, helpId, children, tabIndex, as, tooltip
14
14
  tooltipBgColor: any;
15
15
  tooltipFontColor: any;
16
16
  tooltipFlipOverrides: any;
17
- ariaLabel: any;
17
+ ariaLabel?: string | undefined;
18
18
  }): JSX.Element;
19
19
  declare namespace Help {
20
20
  namespace propTypes {
package/esm/components/help/help.component.js CHANGED
@@ -10,6 +10,7 @@ import Events from "../../__internal__/utils/helpers/events";
10
10
  import { TooltipContext } from "../../__internal__/tooltip-provider";
11
11
  import { filterStyledSystemMarginProps } from "../../style/utils";
12
12
  import { HELP_POSITIONS } from "./help.config";
13
+ import guid from "../../__internal__/utils/helpers/guid";
13
14
  const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
14
15
 
15
16
  const Help = ({
@@ -26,9 +27,10 @@ const Help = ({
26
27
  tooltipBgColor,
27
28
  tooltipFontColor,
28
29
  tooltipFlipOverrides,
29
- ariaLabel,
30
+ ariaLabel = "help",
30
31
  ...rest
31
32
  }) => {
33
+ const defaultTooltipId = useRef(guid());
32
34
  const helpElement = useRef(null);
33
35
  const [isTooltipVisible, updateTooltipVisible] = useState(false);
34
36
  const {
@@ -56,6 +58,7 @@ const Help = ({
56
58
  }
57
59
 
58
60
  return /*#__PURE__*/React.createElement(StyledHelp, _extends({
61
+ "aria-describedby": isFocused || isTooltipVisible ? tooltipId || defaultTooltipId.current : undefined,
59
62
  className: className,
60
63
  as: tagType,
61
64
  href: href,
@@ -74,9 +77,10 @@ const Help = ({
74
77
  target: "_blank",
75
78
  rel: "noopener noreferrer"
76
79
  } : {
77
- role: "tooltip",
78
- "aria-label": ariaLabel || helpAriaLabel
79
- }, filterStyledSystemMarginProps(rest), rest), /*#__PURE__*/React.createElement(Icon, _extends({
80
+ role: "button",
81
+ "aria-label": helpAriaLabel || ariaLabel
82
+ }, filterStyledSystemMarginProps(rest), rest), /*#__PURE__*/React.createElement(Icon, {
83
+ "aria-hidden": true,
80
84
  type: type,
81
85
  tooltipMessage: children,
82
86
  tooltipPosition: tooltipPosition,
@@ -85,12 +89,8 @@ const Help = ({
85
89
  tooltipFontColor: tooltipFontColor,
86
90
  tooltipFlipOverrides: tooltipFlipOverrides,
87
91
  focusable: false,
88
- tooltipId: tooltipId,
89
- "aria-hidden": "true"
90
- }, href && {
91
- role: "tooltip",
92
- ariaLabel: ariaLabel || helpAriaLabel
93
- })));
92
+ tooltipId: tooltipId || defaultTooltipId.current
93
+ }));
94
94
  };
95
95
 
96
96
  Help.propTypes = { ...marginPropTypes,
package/esm/components/icon/icon.component.js CHANGED
@@ -11,6 +11,7 @@ import { ICON_TOOLTIP_POSITIONS } from "./icon-config";
11
11
  import { TooltipContext } from "../../__internal__/tooltip-provider";
12
12
  const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
13
13
  const Icon = /*#__PURE__*/React.forwardRef(({
14
+ "aria-hidden": ariaHidden,
14
15
  bg,
15
16
  bgShape,
16
17
  bgSize,
@@ -31,7 +32,6 @@ const Icon = /*#__PURE__*/React.forwardRef(({
31
32
  inputSize,
32
33
  role,
33
34
  ariaLabel,
34
- "aria-hidden": ariaHidden,
35
35
  focusable = true,
36
36
  ...rest
37
37
  }, ref) => {
@@ -84,6 +84,7 @@ const Icon = /*#__PURE__*/React.forwardRef(({
84
84
  ...filterStyledSystemMarginProps(rest)
85
85
  };
86
86
  const icon = /*#__PURE__*/React.createElement(StyledIcon, _extends({
87
+ "aria-hidden": ariaHidden,
87
88
  ref: ref,
88
89
  key: "icon",
89
90
  className: className || null,
@@ -91,8 +92,7 @@ const Icon = /*#__PURE__*/React.forwardRef(({
91
92
  }, tagComponent("icon", rest), styleProps, {
92
93
  hasTooltip: hasTooltip,
93
94
  "aria-label": ariaLabel,
94
- "aria-hidden": ariaHidden,
95
- role: hasTooltip && role === undefined ? "tooltip" : role
95
+ role: role
96
96
  }));
97
97
 
98
98
  if (tooltipMessage) {
package/esm/components/settings-row/settings-row.style.js CHANGED
@@ -6,9 +6,7 @@ export const StyledSettingsRow = styled.div`
6
6
  ${margin}
7
7
 
8
8
  clear: both;
9
- color: ${({
10
- theme
11
- }) => theme.palette.slateTint(20)};
9
+ color: var(--colorsUtilityYin055);
12
10
  display: flex;
13
11
  font-size: 14px;
14
12
  justify-content: space-between;
@@ -18,9 +16,7 @@ export const StyledSettingsRow = styled.div`
18
16
  ${({
19
17
  hasDivider
20
18
  }) => hasDivider && css`
21
- border-bottom: 1px solid ${({
22
- theme
23
- }) => theme.palette.slateTint(90)};
19
+ border-bottom: 1px solid var(--colorsUtilityMajor050);
24
20
  padding-bottom: 30px;
25
21
  `}
26
22
 
@@ -29,9 +25,7 @@ export const StyledSettingsRow = styled.div`
29
25
  }
30
26
 
31
27
  ${StyledHeadingTitle} {
32
- color: ${({
33
- theme
34
- }) => theme.palette.slate};
28
+ color: var(--colorsUtilityYin090);
35
29
  font-size: 15px;
36
30
  font-weight: bold;
37
31
  line-height: 18px;
package/esm/components/simple-color-picker/simple-color-input/simple-color-input.style.js CHANGED
@@ -18,7 +18,7 @@ const StyledSimpleColorInput = styled(SimpleColorInput)`
18
18
 
19
19
  &:focus + ${StyledColorSampleBox} {
20
20
  box-shadow: inset 0px 0px 0px var(--borderWidth200)
21
- var(--colorsActionMajorYang100);
21
+ var(--colorsUtilityYang100);
22
22
  border: 2px solid var(--colorsSemanticFocus500);
23
23
  }
24
24
  `;
package/esm/components/simple-color-picker/tick-icon/tick-icon.style.js CHANGED
@@ -10,8 +10,8 @@ const getIconColor = color => {
10
10
  greenMultiplier = 587,
11
11
  blueMultiplier = 114;
12
12
  const contrast = (Math.round(r * redMultiplier) + Math.round(g * greenMultiplier) + Math.round(b * blueMultiplier)) / 1000;
13
- if (contrast < 128) return "var(--colorsActionMajorYang100)";
14
- return "var(--colorsActionMajorYin090)";
13
+ if (contrast < 128) return "var(--colorsUtilityYang100)";
14
+ return "var(--colorsUtilityYin090)";
15
15
  };
16
16
 
17
17
  const StyledTickIcon = styled(Icon)`
package/esm/components/tooltip/tooltip.component.js CHANGED
@@ -51,7 +51,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(({
51
51
  "data-popper-arrow": "",
52
52
  "data-element": "tooltip-pointer",
53
53
  bgColor: bgColor
54
- })), /*#__PURE__*/React.createElement("div", null, content)));
54
+ })), content));
55
55
  };
56
56
 
57
57
  return /*#__PURE__*/React.createElement(Tippy, _extends({
package/lib/__internal__/tooltip-provider/index.js CHANGED
@@ -25,7 +25,7 @@ const TooltipProvider = ({
25
25
  children,
26
26
  tooltipPosition,
27
27
  helpAriaLabel,
28
- focusable = true,
28
+ focusable,
29
29
  tooltipVisible,
30
30
  disabled,
31
31
  target
package/lib/components/advanced-color-picker/advanced-color-picker.style.js CHANGED
@@ -72,7 +72,7 @@ const StyledAdvancedColorPickerPreview = _styledComponents.default.div`
72
72
  exports.StyledAdvancedColorPickerPreview = StyledAdvancedColorPickerPreview;
73
73
  const DialogStyle = (0, _styledComponents.default)(_dialog2.default)`
74
74
  ${_dialog.DialogContentStyle} {
75
- padding: 18px 18px 18px 17px;
75
+ padding: var(--spacing200);
76
76
  }
77
77
 
78
78
  ${_dialog.DialogInnerContentStyle} {
@@ -103,7 +103,7 @@ const DialogStyle = (0, _styledComponents.default)(_dialog2.default)`
103
103
  }
104
104
 
105
105
  [data-component="icon"] {
106
- color: var(--colorsActionMinorYin065);
106
+ color: var(--colorsActionMinor500);
107
107
  }
108
108
  `;
109
109
  exports.DialogStyle = DialogStyle;
package/lib/components/detail/detail.style.js CHANGED
@@ -46,31 +46,26 @@ const StyledDetailContent = _styledComponents.default.div`
46
46
  `;
47
47
  exports.StyledDetailContent = StyledDetailContent;
48
48
  const StyledDetailIcon = (0, _styledComponents.default)(_icon.default)`
49
- ${({
50
- theme
51
- }) => (0, _styledComponents.css)`
52
- position: absolute;
53
- color: ${theme.palette.slateTint(50)};
49
+ position: absolute;
50
+ color: var(--colorsUtilityYin065);
51
+ height: ${iconSize};
52
+ width: ${iconSize};
53
+ top: -1px;
54
+ vertical-align: top;
55
+
56
+ // StyledSvgIcon
57
+ span {
54
58
  height: ${iconSize};
55
59
  width: ${iconSize};
56
- top: -1px;
57
- vertical-align: top;
58
-
59
- // StyledSvgIcon
60
- span {
61
- height: ${iconSize};
62
- width: ${iconSize};
63
- vertical-align: middle;
64
- }
65
- `}
60
+ vertical-align: middle;
61
+ }
66
62
  `;
67
63
  exports.StyledDetailIcon = StyledDetailIcon;
68
64
  const StyledDetailFootnote = _styledComponents.default.div`
69
65
  ${({
70
- hasIcon,
71
- theme
66
+ hasIcon
72
67
  }) => (0, _styledComponents.css)`
73
- color: ${theme.palette.slateTint(20)};
68
+ color: var(--colorsUtilityYin055);
74
69
  font-size: 13px;
75
70
  position: relative;
76
71
  margin-top: -2px;
@@ -83,10 +78,4 @@ const StyledDetailFootnote = _styledComponents.default.div`
83
78
  exports.StyledDetailFootnote = StyledDetailFootnote;
84
79
  StyledDetail.defaultProps = {
85
80
  theme: _themes.baseTheme
86
- };
87
- StyledDetailIcon.defaultProps = {
88
- theme: _themes.baseTheme
89
- };
90
- StyledDetailFootnote.defaultProps = {
91
- theme: _themes.baseTheme
92
81
  };
package/lib/components/help/help.component.d.ts CHANGED
@@ -14,7 +14,7 @@ declare function Help({ className, href, helpId, children, tabIndex, as, tooltip
14
14
  tooltipBgColor: any;
15
15
  tooltipFontColor: any;
16
16
  tooltipFlipOverrides: any;
17
- ariaLabel: any;
17
+ ariaLabel?: string | undefined;
18
18
  }): JSX.Element;
19
19
  declare namespace Help {
20
20
  namespace propTypes {
package/lib/components/help/help.component.js CHANGED
@@ -25,6 +25,8 @@ var _utils = require("../../style/utils");
25
25
 
26
26
  var _help2 = require("./help.config");
27
27
 
28
+ var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
29
+
28
30
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
31
 
30
32
  function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -49,9 +51,10 @@ const Help = ({
49
51
  tooltipBgColor,
50
52
  tooltipFontColor,
51
53
  tooltipFlipOverrides,
52
- ariaLabel,
54
+ ariaLabel = "help",
53
55
  ...rest
54
56
  }) => {
57
+ const defaultTooltipId = (0, _react.useRef)((0, _guid.default)());
55
58
  const helpElement = (0, _react.useRef)(null);
56
59
  const [isTooltipVisible, updateTooltipVisible] = (0, _react.useState)(false);
57
60
  const {
@@ -79,6 +82,7 @@ const Help = ({
79
82
  }
80
83
 
81
84
  return /*#__PURE__*/_react.default.createElement(_help.default, _extends({
85
+ "aria-describedby": isFocused || isTooltipVisible ? tooltipId || defaultTooltipId.current : undefined,
82
86
  className: className,
83
87
  as: tagType,
84
88
  href: href,
@@ -97,9 +101,10 @@ const Help = ({
97
101
  target: "_blank",
98
102
  rel: "noopener noreferrer"
99
103
  } : {
100
- role: "tooltip",
101
- "aria-label": ariaLabel || helpAriaLabel
102
- }, (0, _utils.filterStyledSystemMarginProps)(rest), rest), /*#__PURE__*/_react.default.createElement(_icon.default, _extends({
104
+ role: "button",
105
+ "aria-label": helpAriaLabel || ariaLabel
106
+ }, (0, _utils.filterStyledSystemMarginProps)(rest), rest), /*#__PURE__*/_react.default.createElement(_icon.default, {
107
+ "aria-hidden": true,
103
108
  type: type,
104
109
  tooltipMessage: children,
105
110
  tooltipPosition: tooltipPosition,
@@ -108,12 +113,8 @@ const Help = ({
108
113
  tooltipFontColor: tooltipFontColor,
109
114
  tooltipFlipOverrides: tooltipFlipOverrides,
110
115
  focusable: false,
111
- tooltipId: tooltipId,
112
- "aria-hidden": "true"
113
- }, href && {
114
- role: "tooltip",
115
- ariaLabel: ariaLabel || helpAriaLabel
116
- })));
116
+ tooltipId: tooltipId || defaultTooltipId.current
117
+ }));
117
118
  };
118
119
 
119
120
  Help.propTypes = { ...marginPropTypes,
package/lib/components/icon/icon.component.js CHANGED
@@ -34,6 +34,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
34
34
  const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
35
35
 
36
36
  const Icon = /*#__PURE__*/_react.default.forwardRef(({
37
+ "aria-hidden": ariaHidden,
37
38
  bg,
38
39
  bgShape,
39
40
  bgSize,
@@ -54,7 +55,6 @@ const Icon = /*#__PURE__*/_react.default.forwardRef(({
54
55
  inputSize,
55
56
  role,
56
57
  ariaLabel,
57
- "aria-hidden": ariaHidden,
58
58
  focusable = true,
59
59
  ...rest
60
60
  }, ref) => {
@@ -108,6 +108,7 @@ const Icon = /*#__PURE__*/_react.default.forwardRef(({
108
108
  };
109
109
 
110
110
  const icon = /*#__PURE__*/_react.default.createElement(_icon.default, _extends({
111
+ "aria-hidden": ariaHidden,
111
112
  ref: ref,
112
113
  key: "icon",
113
114
  className: className || null,
@@ -115,8 +116,7 @@ const Icon = /*#__PURE__*/_react.default.forwardRef(({
115
116
  }, (0, _tags.default)("icon", rest), styleProps, {
116
117
  hasTooltip: hasTooltip,
117
118
  "aria-label": ariaLabel,
118
- "aria-hidden": ariaHidden,
119
- role: hasTooltip && role === undefined ? "tooltip" : role
119
+ role: role
120
120
  }));
121
121
 
122
122
  if (tooltipMessage) {
package/lib/components/settings-row/settings-row.style.js CHANGED
@@ -23,9 +23,7 @@ const StyledSettingsRow = _styledComponents.default.div`
23
23
  ${_styledSystem.margin}
24
24
 
25
25
  clear: both;
26
- color: ${({
27
- theme
28
- }) => theme.palette.slateTint(20)};
26
+ color: var(--colorsUtilityYin055);
29
27
  display: flex;
30
28
  font-size: 14px;
31
29
  justify-content: space-between;
@@ -35,9 +33,7 @@ const StyledSettingsRow = _styledComponents.default.div`
35
33
  ${({
36
34
  hasDivider
37
35
  }) => hasDivider && (0, _styledComponents.css)`
38
- border-bottom: 1px solid ${({
39
- theme
40
- }) => theme.palette.slateTint(90)};
36
+ border-bottom: 1px solid var(--colorsUtilityMajor050);
41
37
  padding-bottom: 30px;
42
38
  `}
43
39
 
@@ -46,9 +42,7 @@ const StyledSettingsRow = _styledComponents.default.div`
46
42
  }
47
43
 
48
44
  ${_heading.StyledHeadingTitle} {
49
- color: ${({
50
- theme
51
- }) => theme.palette.slate};
45
+ color: var(--colorsUtilityYin090);
52
46
  font-size: 15px;
53
47
  font-weight: bold;
54
48
  line-height: 18px;
package/lib/components/simple-color-picker/simple-color-input/simple-color-input.style.js CHANGED
@@ -30,7 +30,7 @@ const StyledSimpleColorInput = (0, _styledComponents.default)(_input.Input)`
30
30
 
31
31
  &:focus + ${_colorSampleBox.default} {
32
32
  box-shadow: inset 0px 0px 0px var(--borderWidth200)
33
- var(--colorsActionMajorYang100);
33
+ var(--colorsUtilityYang100);
34
34
  border: 2px solid var(--colorsSemanticFocus500);
35
35
  }
36
36
  `;
package/lib/components/simple-color-picker/tick-icon/tick-icon.style.js CHANGED
@@ -25,8 +25,8 @@ const getIconColor = color => {
25
25
  greenMultiplier = 587,
26
26
  blueMultiplier = 114;
27
27
  const contrast = (Math.round(r * redMultiplier) + Math.round(g * greenMultiplier) + Math.round(b * blueMultiplier)) / 1000;
28
- if (contrast < 128) return "var(--colorsActionMajorYang100)";
29
- return "var(--colorsActionMajorYin090)";
28
+ if (contrast < 128) return "var(--colorsUtilityYang100)";
29
+ return "var(--colorsUtilityYin090)";
30
30
  };
31
31
 
32
32
  const StyledTickIcon = (0, _styledComponents.default)(_icon.default)`
package/lib/components/tooltip/tooltip.component.js CHANGED
@@ -72,7 +72,7 @@ const Tooltip = /*#__PURE__*/_react.default.forwardRef(({
72
72
  "data-popper-arrow": "",
73
73
  "data-element": "tooltip-pointer",
74
74
  bgColor: bgColor
75
- })), /*#__PURE__*/_react.default.createElement("div", null, content)));
75
+ })), content));
76
76
  };
77
77
 
78
78
  return /*#__PURE__*/_react.default.createElement(_headless.default, _extends({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "104.43.0",
3
+ "version": "104.45.0",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "engineStrict": true,
6
6
  "engines": {