carbon-react 152.5.1 → 152.7.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 (25) hide show
  1. package/esm/__internal__/input/input.component.d.ts +6 -1
  2. package/esm/__internal__/input/input.component.js +3 -2
  3. package/esm/components/accordion/accordion-group/accordion-group.component.js +6 -0
  4. package/esm/components/select/__internal__/select-textbox/select-textbox.component.js +1 -1
  5. package/esm/components/select/simple-select/simple-select.component.js +1 -1
  6. package/esm/components/textarea/textarea.component.js +10 -3
  7. package/esm/components/textbox/textbox.component.js +10 -3
  8. package/esm/hooks/{__internal__/useCharacterCount → useCharacterCount}/useCharacterCount.js +3 -3
  9. package/lib/__internal__/input/input.component.d.ts +6 -1
  10. package/lib/__internal__/input/input.component.js +3 -2
  11. package/lib/components/accordion/accordion-group/accordion-group.component.js +6 -0
  12. package/lib/components/select/__internal__/select-textbox/select-textbox.component.js +1 -1
  13. package/lib/components/select/simple-select/simple-select.component.js +1 -1
  14. package/lib/components/textarea/textarea.component.js +10 -3
  15. package/lib/components/textbox/textbox.component.js +10 -3
  16. package/lib/hooks/useCharacterCount/package.json +6 -0
  17. package/lib/hooks/{__internal__/useCharacterCount → useCharacterCount}/useCharacterCount.js +3 -3
  18. package/package.json +1 -1
  19. package/lib/hooks/__internal__/useCharacterCount/package.json +0 -6
  20. /package/esm/hooks/{__internal__/useCharacterCount → useCharacterCount}/index.d.ts +0 -0
  21. /package/esm/hooks/{__internal__/useCharacterCount → useCharacterCount}/index.js +0 -0
  22. /package/esm/hooks/{__internal__/useCharacterCount → useCharacterCount}/useCharacterCount.d.ts +0 -0
  23. /package/lib/hooks/{__internal__/useCharacterCount → useCharacterCount}/index.d.ts +0 -0
  24. /package/lib/hooks/{__internal__/useCharacterCount → useCharacterCount}/index.js +0 -0
  25. /package/lib/hooks/{__internal__/useCharacterCount → useCharacterCount}/useCharacterCount.d.ts +0 -0
@@ -3,8 +3,13 @@ import { BorderRadiusType } from "../../components/box/box.component";
3
3
  export declare type EnterKeyHintTypes = "enter" | "done" | "go" | "next" | "previous" | "search" | "send";
4
4
  export interface CommonInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
5
5
  align?: "right" | "left";
6
- /** The id of the element that describe the input. */
6
+ /**
7
+ * Set the ID of the input's description.
8
+ * @deprecated Please use `aria-describedby` instead.
9
+ */
7
10
  ariaDescribedBy?: string;
11
+ /** The ID of the input's description, is set along with hint text and error message. */
12
+ "aria-describedby"?: string;
8
13
  /** Override the variant component */
9
14
  as?: React.ElementType;
10
15
  /** If true the Component will be focused when rendered */
@@ -27,7 +27,8 @@ function selectTextOnFocus(input) {
27
27
  const Input = /*#__PURE__*/React.forwardRef(({
28
28
  align,
29
29
  "aria-labelledby": ariaLabelledBy,
30
- ariaDescribedBy,
30
+ "aria-describedby": ariaDescribedBy,
31
+ ariaDescribedBy: ariaDescribedByDeprecated,
31
32
  placeholder,
32
33
  disabled,
33
34
  readOnly,
@@ -126,7 +127,7 @@ const Input = /*#__PURE__*/React.forwardRef(({
126
127
  handleDeferred(ev);
127
128
  };
128
129
  const hasValidationPart = (context.hasFocus || groupContext.hasFocus || context.hasMouseOver || groupContext.hasMouseOver) && validationIconId;
129
- const descriptionList = ariaDescribedBy ? [ariaDescribedBy] : [];
130
+ const descriptionList = ariaDescribedBy || ariaDescribedByDeprecated ? [ariaDescribedBy || ariaDescribedByDeprecated] : [];
130
131
  if (hasValidationPart) {
131
132
  descriptionList.push(validationIconId);
132
133
  }
@@ -5,14 +5,20 @@ import Events from "../../../__internal__/utils/helpers/events";
5
5
  import Accordion from "../accordion.component";
6
6
  import { StyledAccordionGroup } from "../accordion.style";
7
7
  import tagComponent from "../../../__internal__/utils/helpers/tags";
8
+ import Logger from "../../../__internal__/utils/logger";
8
9
 
9
10
  // typescript-to-proptypes breaks on recursive type references so it has to be an interface
10
11
  // eslint-disable-next-line @typescript-eslint/no-empty-interface
11
12
 
13
+ let deprecatedWarnTriggered = false;
12
14
  export const AccordionGroup = ({
13
15
  children,
14
16
  ...rest
15
17
  }) => {
18
+ if (!deprecatedWarnTriggered) {
19
+ deprecatedWarnTriggered = true;
20
+ Logger.deprecate("`AccordionGroup` is deprecated and will soon be removed.");
21
+ }
16
22
  const hasProperChildren = useMemo(() => {
17
23
  let hasAccordionChildren = true;
18
24
  React.Children.toArray(children).forEach(child => {
@@ -72,7 +72,7 @@ const SelectTextbox = /*#__PURE__*/React.forwardRef(({
72
72
  isInputInSelect: true
73
73
  }
74
74
  }, /*#__PURE__*/React.createElement(Textbox, _extends({
75
- ariaDescribedBy: ariaDescribedBy,
75
+ "aria-describedby": ariaDescribedBy,
76
76
  "aria-label": ariaLabel,
77
77
  "data-element": "select-input",
78
78
  "data-role": "select-textbox",
@@ -342,7 +342,7 @@ export const SimpleSelect = /*#__PURE__*/React.forwardRef(({
342
342
  "aria-controls": selectListId.current,
343
343
  activeDescendantId: activeDescendantId,
344
344
  ariaLabelledby: ariaLabelledby,
345
- ariaDescribedBy: ariaDescribedBy,
345
+ "aria-describedby": ariaDescribedBy,
346
346
  isOpen: isOpen
347
347
  }, getTextboxProps()))), selectList);
348
348
  });
@@ -3,7 +3,7 @@ import React, { useRef, useEffect, useContext, useCallback, useState } from "rea
3
3
  import tagComponent from "../../__internal__/utils/helpers/tags";
4
4
  import { InputPresentation } from "../../__internal__/input";
5
5
  import FormField from "../../__internal__/form-field";
6
- import useCharacterCount from "../../hooks/__internal__/useCharacterCount";
6
+ import useCharacterCount from "../../hooks/useCharacterCount";
7
7
  import Input from "../../__internal__/input/input.component";
8
8
  import { InputBehaviour } from "../../__internal__/input-behaviour";
9
9
  import InputIconToggle from "../../__internal__/input-icon-toggle";
@@ -19,9 +19,12 @@ import Logger from "../../__internal__/utils/logger";
19
19
  import HintText from "../../__internal__/hint-text";
20
20
  import { filterStyledSystemMarginProps } from "../../style/utils";
21
21
  let deprecateUncontrolledWarnTriggered = false;
22
+ let deprecatedAriaDescribedByWarnTriggered = false;
22
23
  let warnBorderRadiusArrayTooLarge = false;
23
24
  export const Textarea = /*#__PURE__*/React.forwardRef(({
24
25
  "aria-labelledby": ariaLabelledBy,
26
+ "aria-describedby": ariaDescribedByProp,
27
+ ariaDescribedBy: ariaDescribedByPropDeprecated,
25
28
  autoFocus,
26
29
  inputHint,
27
30
  fieldHelp,
@@ -103,6 +106,10 @@ export const Textarea = /*#__PURE__*/React.forwardRef(({
103
106
  deprecateUncontrolledWarnTriggered = true;
104
107
  Logger.deprecate("Uncontrolled behaviour in `Textarea` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
105
108
  }
109
+ if (!deprecatedAriaDescribedByWarnTriggered && ariaDescribedByPropDeprecated) {
110
+ deprecatedAriaDescribedByWarnTriggered = true;
111
+ Logger.deprecate("The `ariaDescribedBy` prop in `Textarea` is deprecated and will soon be removed, please use `aria-describedby` instead.");
112
+ }
106
113
  if (Array.isArray(borderRadius) && borderRadius.length > 4 && !warnBorderRadiusArrayTooLarge) {
107
114
  // eslint-disable-next-line no-console
108
115
  console.warn("The `borderRadius` prop in `Textarea` component only supports up to 4 values.");
@@ -172,7 +179,7 @@ export const Textarea = /*#__PURE__*/React.forwardRef(({
172
179
  const hasIconInside = !!(inputIcon || validationId && !validationOnLabel);
173
180
  const hintId = useRef(guid());
174
181
  const inputHintId = inputHint ? hintId.current : undefined;
175
- const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId].filter(Boolean).join(" ");
182
+ const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId, ariaDescribedByProp || ariaDescribedByPropDeprecated].filter(Boolean).join(" ");
176
183
  const input = /*#__PURE__*/React.createElement(InputPresentation, {
177
184
  disabled: disabled,
178
185
  readOnly: readOnly,
@@ -186,7 +193,7 @@ export const Textarea = /*#__PURE__*/React.forwardRef(({
186
193
  }, /*#__PURE__*/React.createElement(Input, _extends({
187
194
  "aria-invalid": !!error,
188
195
  "aria-labelledby": ariaLabelledBy,
189
- ariaDescribedBy: combinedAriaDescribedBy,
196
+ "aria-describedby": combinedAriaDescribedBy,
190
197
  autoFocus: autoFocus,
191
198
  name: name,
192
199
  value: value,
@@ -12,7 +12,7 @@ import { filterStyledSystemMarginProps } from "../../style/utils";
12
12
  import NewValidationContext from "../carbon-provider/__internal__/new-validation.context";
13
13
  import NumeralDateContext from "../numeral-date/__internal__/numeral-date.context";
14
14
  import Logger from "../../__internal__/utils/logger";
15
- import useCharacterCount from "../../hooks/__internal__/useCharacterCount";
15
+ import useCharacterCount from "../../hooks/useCharacterCount";
16
16
  import useUniqueId from "../../hooks/__internal__/useUniqueId";
17
17
  import guid from "../../__internal__/utils/helpers/guid";
18
18
  import useInputAccessibility from "../../hooks/__internal__/useInputAccessibility/useInputAccessibility";
@@ -23,8 +23,11 @@ export const SIZE_DEFAULT = "medium";
23
23
  export const LABEL_WIDTH_DEFAULT = 30;
24
24
  export const LABEL_VALIDATION_DEFAULT = false;
25
25
  let deprecateUncontrolledWarnTriggered = false;
26
+ let deprecatedAriaDescribedByWarnTriggered = false;
26
27
  export const Textbox = /*#__PURE__*/React.forwardRef(({
27
28
  "aria-labelledby": ariaLabelledBy,
29
+ "aria-describedby": ariaDescribedByProp,
30
+ ariaDescribedBy: ariaDescribedByDeprecated,
28
31
  align = ALIGN_DEFAULT,
29
32
  autoFocus,
30
33
  children,
@@ -106,6 +109,10 @@ export const Textbox = /*#__PURE__*/React.forwardRef(({
106
109
  deprecateUncontrolledWarnTriggered = true;
107
110
  Logger.deprecate("Uncontrolled behaviour in `Textbox` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
108
111
  }
112
+ if (!deprecatedAriaDescribedByWarnTriggered && ariaDescribedByDeprecated) {
113
+ deprecatedAriaDescribedByWarnTriggered = true;
114
+ Logger.deprecate("The `ariaDescribedBy` prop in `Textbox` is deprecated and will soon be removed, please use `aria-describedby` instead.");
115
+ }
109
116
  const {
110
117
  labelId,
111
118
  validationId,
@@ -122,7 +129,7 @@ export const Textbox = /*#__PURE__*/React.forwardRef(({
122
129
  });
123
130
  const hintId = useRef(guid());
124
131
  const inputHintId = inputHint ? hintId.current : undefined;
125
- const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId].filter(Boolean).join(" ");
132
+ const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId, ariaDescribedByProp || ariaDescribedByDeprecated].filter(Boolean).join(" ");
126
133
  const hasIconInside = !!(inputIcon || validationId && !validationOnLabel);
127
134
  const input = /*#__PURE__*/React.createElement(InputPresentation, {
128
135
  align: align,
@@ -146,7 +153,7 @@ export const Textbox = /*#__PURE__*/React.forwardRef(({
146
153
  align: align,
147
154
  "aria-invalid": !!error,
148
155
  "aria-labelledby": ariaLabelledBy,
149
- ariaDescribedBy: combinedAriaDescribedBy,
156
+ "aria-describedby": combinedAriaDescribedBy,
150
157
  autoFocus: autoFocus,
151
158
  deferTimeout: deferTimeout,
152
159
  disabled: disabled,
@@ -1,7 +1,7 @@
1
1
  import React, { useMemo, useRef, useEffect, useState } from "react";
2
- import CharacterCount from "../../../__internal__/character-count";
3
- import guid from "../../../__internal__/utils/helpers/guid";
4
- import useDebounce from "../useDebounce";
2
+ import CharacterCount from "../../__internal__/character-count";
3
+ import guid from "../../__internal__/utils/helpers/guid";
4
+ import useDebounce from "../__internal__/useDebounce";
5
5
  const useCharacterCount = (value = "", characterLimit, characterCountAriaLive) => {
6
6
  const isCharacterLimitValid = typeof characterLimit === "number" && !Number.isNaN(characterLimit);
7
7
  const [debouncedValue, setDebouncedValue] = useState(value);
@@ -3,8 +3,13 @@ import { BorderRadiusType } from "../../components/box/box.component";
3
3
  export declare type EnterKeyHintTypes = "enter" | "done" | "go" | "next" | "previous" | "search" | "send";
4
4
  export interface CommonInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
5
5
  align?: "right" | "left";
6
- /** The id of the element that describe the input. */
6
+ /**
7
+ * Set the ID of the input's description.
8
+ * @deprecated Please use `aria-describedby` instead.
9
+ */
7
10
  ariaDescribedBy?: string;
11
+ /** The ID of the input's description, is set along with hint text and error message. */
12
+ "aria-describedby"?: string;
8
13
  /** Override the variant component */
9
14
  as?: React.ElementType;
10
15
  /** If true the Component will be focused when rendered */
@@ -36,7 +36,8 @@ function selectTextOnFocus(input) {
36
36
  const Input = /*#__PURE__*/_react.default.forwardRef(({
37
37
  align,
38
38
  "aria-labelledby": ariaLabelledBy,
39
- ariaDescribedBy,
39
+ "aria-describedby": ariaDescribedBy,
40
+ ariaDescribedBy: ariaDescribedByDeprecated,
40
41
  placeholder,
41
42
  disabled,
42
43
  readOnly,
@@ -135,7 +136,7 @@ const Input = /*#__PURE__*/_react.default.forwardRef(({
135
136
  handleDeferred(ev);
136
137
  };
137
138
  const hasValidationPart = (context.hasFocus || groupContext.hasFocus || context.hasMouseOver || groupContext.hasMouseOver) && validationIconId;
138
- const descriptionList = ariaDescribedBy ? [ariaDescribedBy] : [];
139
+ const descriptionList = ariaDescribedBy || ariaDescribedByDeprecated ? [ariaDescribedBy || ariaDescribedByDeprecated] : [];
139
140
  if (hasValidationPart) {
140
141
  descriptionList.push(validationIconId);
141
142
  }
@@ -10,6 +10,7 @@ var _events = _interopRequireDefault(require("../../../__internal__/utils/helper
10
10
  var _accordion = _interopRequireDefault(require("../accordion.component"));
11
11
  var _accordion2 = require("../accordion.style");
12
12
  var _tags = _interopRequireDefault(require("../../../__internal__/utils/helpers/tags"));
13
+ var _logger = _interopRequireDefault(require("../../../__internal__/utils/logger"));
13
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
15
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
15
16
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -17,10 +18,15 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
17
18
  // typescript-to-proptypes breaks on recursive type references so it has to be an interface
18
19
  // eslint-disable-next-line @typescript-eslint/no-empty-interface
19
20
 
21
+ let deprecatedWarnTriggered = false;
20
22
  const AccordionGroup = ({
21
23
  children,
22
24
  ...rest
23
25
  }) => {
26
+ if (!deprecatedWarnTriggered) {
27
+ deprecatedWarnTriggered = true;
28
+ _logger.default.deprecate("`AccordionGroup` is deprecated and will soon be removed.");
29
+ }
24
30
  const hasProperChildren = (0, _react.useMemo)(() => {
25
31
  let hasAccordionChildren = true;
26
32
  _react.default.Children.toArray(children).forEach(child => {
@@ -79,7 +79,7 @@ const SelectTextbox = /*#__PURE__*/_react.default.forwardRef(({
79
79
  isInputInSelect: true
80
80
  }
81
81
  }, /*#__PURE__*/_react.default.createElement(_textbox.default, _extends({
82
- ariaDescribedBy: ariaDescribedBy,
82
+ "aria-describedby": ariaDescribedBy,
83
83
  "aria-label": ariaLabel,
84
84
  "data-element": "select-input",
85
85
  "data-role": "select-textbox",
@@ -351,7 +351,7 @@ const SimpleSelect = exports.SimpleSelect = /*#__PURE__*/_react.default.forwardR
351
351
  "aria-controls": selectListId.current,
352
352
  activeDescendantId: activeDescendantId,
353
353
  ariaLabelledby: ariaLabelledby,
354
- ariaDescribedBy: ariaDescribedBy,
354
+ "aria-describedby": ariaDescribedBy,
355
355
  isOpen: isOpen
356
356
  }, getTextboxProps()))), selectList);
357
357
  });
@@ -8,7 +8,7 @@ var _react = _interopRequireWildcard(require("react"));
8
8
  var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags"));
9
9
  var _input = require("../../__internal__/input");
10
10
  var _formField = _interopRequireDefault(require("../../__internal__/form-field"));
11
- var _useCharacterCount = _interopRequireDefault(require("../../hooks/__internal__/useCharacterCount"));
11
+ var _useCharacterCount = _interopRequireDefault(require("../../hooks/useCharacterCount"));
12
12
  var _input2 = _interopRequireDefault(require("../../__internal__/input/input.component"));
13
13
  var _inputBehaviour = require("../../__internal__/input-behaviour");
14
14
  var _inputIconToggle = _interopRequireDefault(require("../../__internal__/input-icon-toggle"));
@@ -28,9 +28,12 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
28
28
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
29
29
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
30
30
  let deprecateUncontrolledWarnTriggered = false;
31
+ let deprecatedAriaDescribedByWarnTriggered = false;
31
32
  let warnBorderRadiusArrayTooLarge = false;
32
33
  const Textarea = exports.OriginalTextarea = exports.Textarea = /*#__PURE__*/_react.default.forwardRef(({
33
34
  "aria-labelledby": ariaLabelledBy,
35
+ "aria-describedby": ariaDescribedByProp,
36
+ ariaDescribedBy: ariaDescribedByPropDeprecated,
34
37
  autoFocus,
35
38
  inputHint,
36
39
  fieldHelp,
@@ -112,6 +115,10 @@ const Textarea = exports.OriginalTextarea = exports.Textarea = /*#__PURE__*/_rea
112
115
  deprecateUncontrolledWarnTriggered = true;
113
116
  _logger.default.deprecate("Uncontrolled behaviour in `Textarea` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
114
117
  }
118
+ if (!deprecatedAriaDescribedByWarnTriggered && ariaDescribedByPropDeprecated) {
119
+ deprecatedAriaDescribedByWarnTriggered = true;
120
+ _logger.default.deprecate("The `ariaDescribedBy` prop in `Textarea` is deprecated and will soon be removed, please use `aria-describedby` instead.");
121
+ }
115
122
  if (Array.isArray(borderRadius) && borderRadius.length > 4 && !warnBorderRadiusArrayTooLarge) {
116
123
  // eslint-disable-next-line no-console
117
124
  console.warn("The `borderRadius` prop in `Textarea` component only supports up to 4 values.");
@@ -181,7 +188,7 @@ const Textarea = exports.OriginalTextarea = exports.Textarea = /*#__PURE__*/_rea
181
188
  const hasIconInside = !!(inputIcon || validationId && !validationOnLabel);
182
189
  const hintId = (0, _react.useRef)((0, _guid.default)());
183
190
  const inputHintId = inputHint ? hintId.current : undefined;
184
- const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId].filter(Boolean).join(" ");
191
+ const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId, ariaDescribedByProp || ariaDescribedByPropDeprecated].filter(Boolean).join(" ");
185
192
  const input = /*#__PURE__*/_react.default.createElement(_input.InputPresentation, {
186
193
  disabled: disabled,
187
194
  readOnly: readOnly,
@@ -195,7 +202,7 @@ const Textarea = exports.OriginalTextarea = exports.Textarea = /*#__PURE__*/_rea
195
202
  }, /*#__PURE__*/_react.default.createElement(_input2.default, _extends({
196
203
  "aria-invalid": !!error,
197
204
  "aria-labelledby": ariaLabelledBy,
198
- ariaDescribedBy: combinedAriaDescribedBy,
205
+ "aria-describedby": combinedAriaDescribedBy,
199
206
  autoFocus: autoFocus,
200
207
  name: name,
201
208
  value: value,
@@ -17,7 +17,7 @@ var _utils = require("../../style/utils");
17
17
  var _newValidation = _interopRequireDefault(require("../carbon-provider/__internal__/new-validation.context"));
18
18
  var _numeralDate = _interopRequireDefault(require("../numeral-date/__internal__/numeral-date.context"));
19
19
  var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
20
- var _useCharacterCount = _interopRequireDefault(require("../../hooks/__internal__/useCharacterCount"));
20
+ var _useCharacterCount = _interopRequireDefault(require("../../hooks/useCharacterCount"));
21
21
  var _useUniqueId = _interopRequireDefault(require("../../hooks/__internal__/useUniqueId"));
22
22
  var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
23
23
  var _useInputAccessibility = _interopRequireDefault(require("../../hooks/__internal__/useInputAccessibility/useInputAccessibility"));
@@ -32,8 +32,11 @@ const SIZE_DEFAULT = exports.SIZE_DEFAULT = "medium";
32
32
  const LABEL_WIDTH_DEFAULT = exports.LABEL_WIDTH_DEFAULT = 30;
33
33
  const LABEL_VALIDATION_DEFAULT = exports.LABEL_VALIDATION_DEFAULT = false;
34
34
  let deprecateUncontrolledWarnTriggered = false;
35
+ let deprecatedAriaDescribedByWarnTriggered = false;
35
36
  const Textbox = exports.Textbox = /*#__PURE__*/_react.default.forwardRef(({
36
37
  "aria-labelledby": ariaLabelledBy,
38
+ "aria-describedby": ariaDescribedByProp,
39
+ ariaDescribedBy: ariaDescribedByDeprecated,
37
40
  align = ALIGN_DEFAULT,
38
41
  autoFocus,
39
42
  children,
@@ -115,6 +118,10 @@ const Textbox = exports.Textbox = /*#__PURE__*/_react.default.forwardRef(({
115
118
  deprecateUncontrolledWarnTriggered = true;
116
119
  _logger.default.deprecate("Uncontrolled behaviour in `Textbox` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
117
120
  }
121
+ if (!deprecatedAriaDescribedByWarnTriggered && ariaDescribedByDeprecated) {
122
+ deprecatedAriaDescribedByWarnTriggered = true;
123
+ _logger.default.deprecate("The `ariaDescribedBy` prop in `Textbox` is deprecated and will soon be removed, please use `aria-describedby` instead.");
124
+ }
118
125
  const {
119
126
  labelId,
120
127
  validationId,
@@ -131,7 +138,7 @@ const Textbox = exports.Textbox = /*#__PURE__*/_react.default.forwardRef(({
131
138
  });
132
139
  const hintId = (0, _react.useRef)((0, _guid.default)());
133
140
  const inputHintId = inputHint ? hintId.current : undefined;
134
- const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId].filter(Boolean).join(" ");
141
+ const combinedAriaDescribedBy = [ariaDescribedBy, inputHintId, visuallyHiddenHintId, ariaDescribedByProp || ariaDescribedByDeprecated].filter(Boolean).join(" ");
135
142
  const hasIconInside = !!(inputIcon || validationId && !validationOnLabel);
136
143
  const input = /*#__PURE__*/_react.default.createElement(_input.InputPresentation, {
137
144
  align: align,
@@ -155,7 +162,7 @@ const Textbox = exports.Textbox = /*#__PURE__*/_react.default.forwardRef(({
155
162
  align: align,
156
163
  "aria-invalid": !!error,
157
164
  "aria-labelledby": ariaLabelledBy,
158
- ariaDescribedBy: combinedAriaDescribedBy,
165
+ "aria-describedby": combinedAriaDescribedBy,
159
166
  autoFocus: autoFocus,
160
167
  deferTimeout: deferTimeout,
161
168
  disabled: disabled,
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "module": "../../../esm/hooks/useCharacterCount/index.js",
4
+ "main": "./index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _react = _interopRequireWildcard(require("react"));
8
- var _characterCount = _interopRequireDefault(require("../../../__internal__/character-count"));
9
- var _guid = _interopRequireDefault(require("../../../__internal__/utils/helpers/guid"));
10
- var _useDebounce = _interopRequireDefault(require("../useDebounce"));
8
+ var _characterCount = _interopRequireDefault(require("../../__internal__/character-count"));
9
+ var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
10
+ var _useDebounce = _interopRequireDefault(require("../__internal__/useDebounce"));
11
11
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
12
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
13
13
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "152.5.1",
3
+ "version": "152.7.0",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "files": [
6
6
  "lib",
@@ -1,6 +0,0 @@
1
- {
2
- "sideEffects": false,
3
- "module": "../../../../esm/hooks/__internal__/useCharacterCount/index.js",
4
- "main": "./index.js",
5
- "types": "./index.d.ts"
6
- }