carbon-react 104.43.0 → 104.43.1

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 (11) hide show
  1. package/esm/__internal__/tooltip-provider/index.js +1 -1
  2. package/esm/components/help/help.component.d.ts +1 -1
  3. package/esm/components/help/help.component.js +10 -10
  4. package/esm/components/icon/icon.component.js +3 -3
  5. package/esm/components/tooltip/tooltip.component.js +1 -1
  6. package/lib/__internal__/tooltip-provider/index.js +1 -1
  7. package/lib/components/help/help.component.d.ts +1 -1
  8. package/lib/components/help/help.component.js +11 -10
  9. package/lib/components/icon/icon.component.js +3 -3
  10. package/lib/components/tooltip/tooltip.component.js +1 -1
  11. 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/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/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/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/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.43.1",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "engineStrict": true,
6
6
  "engines": {