carbon-react 114.18.2 → 115.0.0

package/lib/components/number/number.component.js

@@ -193,7 +193,6 @@ Number.propTypes = {
   "label": _propTypes.default.string,
   "labelAlign": _propTypes.default.oneOf(["left", "right"]),
   "labelHelp": _propTypes.default.node,
-  "labelId": _propTypes.default.string,
   "labelInline": _propTypes.default.bool,
   "labelSpacing": _propTypes.default.oneOf([1, 2]),
   "labelWidth": _propTypes.default.number,

package/lib/components/select/filterable-select/filterable-select.component.js

@@ -33,6 +33,8 @@ var _useStableCallback = _interopRequireDefault(require("../../../hooks/__intern
 
 var _useFormSpacing = _interopRequireDefault(require("../../../hooks/__internal__/useFormSpacing"));
 
+var _useInputAccessibility = _interopRequireDefault(require("../../../hooks/__internal__/useInputAccessibility/useInputAccessibility"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -83,7 +85,6 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
 }, ref) => {
   const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
   const selectListId = (0, _react.useRef)((0, _guid.default)());
-  const labelId = (0, _react.useRef)(label ? (0, _guid.default)() : undefined);
   const containerRef = (0, _react.useRef)();
   const listboxRef = (0, _react.useRef)();
   const isControlled = (0, _react.useRef)(value !== undefined);
@@ -96,6 +97,13 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
   const [selectedValue, setSelectedValue] = (0, _react.useState)(value || defaultValue || "");
   const [highlightedValue, setHighlightedValue] = (0, _react.useState)("");
   const [filterText, setFilterText] = (0, _react.useState)("");
+  const inputId = (0, _react.useRef)(id || (0, _guid.default)());
+  const {
+    labelId
+  } = (0, _useInputAccessibility.default)({
+    id: inputId.current,
+    label
+  });
 
   if (!deprecateInputRefWarnTriggered && inputRef) {
     deprecateInputRefWarnTriggered = true;
@@ -418,7 +426,7 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
 
   function getTextboxProps() {
     return {
-      id,
+      id: inputId.current,
       name,
       label,
       disabled,
@@ -443,7 +451,7 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
   const selectList = /*#__PURE__*/_react.default.createElement(FilterableSelectList, {
     ref: listboxRef,
     id: selectListId.current,
-    labelId: label ? labelId.current : undefined,
+    labelId: labelId,
     anchorElement: textboxRef && textboxRef.parentElement,
     onSelect: onSelectOption,
     onSelectListClose: onSelectListClose,
@@ -481,7 +489,7 @@ const FilterableSelect = /*#__PURE__*/_react.default.forwardRef(({
     ref: containerRef
   }, /*#__PURE__*/_react.default.createElement(_selectTextbox.default, _extends({
     activeDescendantId: activeDescendantId,
-    labelId: label ? labelId.current : undefined,
+    labelId: labelId,
     "aria-controls": selectListId.current,
     isOpen: isOpen,
     hasTextCursor: true,

package/lib/components/select/multi-select/multi-select.component.js

@@ -37,6 +37,8 @@ var _useStableCallback = _interopRequireDefault(require("../../../hooks/__intern
 
 var _useFormSpacing = _interopRequireDefault(require("../../../hooks/__internal__/useFormSpacing"));
 
+var _useInputAccessibility = _interopRequireDefault(require("../../../hooks/__internal__/useInputAccessibility/useInputAccessibility"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -52,6 +54,7 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
   value,
   defaultValue,
   id,
+  label,
   name,
   disabled,
   readOnly,
@@ -87,7 +90,6 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
   const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
   const selectListId = (0, _react.useRef)((0, _guid.default)());
   const accessibilityLabelId = (0, _react.useRef)((0, _guid.default)());
-  const labelId = (0, _react.useRef)((0, _guid.default)());
   const containerRef = (0, _react.useRef)();
   const listboxRef = (0, _react.useRef)();
   const isInputFocused = (0, _react.useRef)(false);
@@ -102,6 +104,13 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
   const [highlightedValue, setHighlightedValue] = (0, _react.useState)("");
   const [filterText, setFilterText] = (0, _react.useState)("");
   const [placeholderOverride, setPlaceholderOverride] = (0, _react.useState)();
+  const inputId = (0, _react.useRef)(id || (0, _guid.default)());
+  const {
+    labelId
+  } = (0, _useInputAccessibility.default)({
+    id: inputId.current,
+    label
+  });
   const actualValue = isControlled.current ? value : selectedValue;
 
   if (!deprecateInputRefWarnTriggered && inputRef) {
@@ -434,9 +443,10 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
 
   function getTextboxProps() {
     return {
-      id,
+      id: inputId.current,
       name,
       disabled,
+      label,
       readOnly,
       placeholder: placeholderOverride,
       leftChildren: mapValuesToPills,
@@ -461,7 +471,7 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
   const selectList = /*#__PURE__*/_react.default.createElement(FilterableSelectList, {
     ref: listboxRef,
     id: selectListId.current,
-    labelId: labelId.current,
+    labelId: labelId,
     anchorElement: textboxRef && textboxRef.parentElement,
     onSelect: onSelectOption,
     onSelectListClose: onSelectListClose,
@@ -504,7 +514,7 @@ const MultiSelect = /*#__PURE__*/_react.default.forwardRef(({
     "aria-controls": selectListId.current,
     hasTextCursor: true,
     isOpen: isOpen,
-    labelId: labelId.current,
+    labelId: labelId,
     textboxRef: textboxRef
   }, getTextboxProps()))), selectList);
 });

package/lib/components/select/select-textbox/select-textbox.component.js

@@ -51,6 +51,7 @@ const SelectTextbox = /*#__PURE__*/_react.default.forwardRef(({
   value,
   disabled,
   isOpen,
+  id,
   readOnly,
   placeholder,
   size = "medium",
@@ -110,6 +111,7 @@ const SelectTextbox = /*#__PURE__*/_react.default.forwardRef(({
   function getTextboxProps() {
     return {
       disabled,
+      id,
       readOnly,
       required,
       onClick: handleTextboxClick,

package/lib/components/select/simple-select/simple-select.component.js

@@ -33,6 +33,8 @@ var _logger = _interopRequireDefault(require("../../../__internal__/utils/logger
 
 var _useFormSpacing = _interopRequireDefault(require("../../../hooks/__internal__/useFormSpacing"));
 
+var _useInputAccessibility = _interopRequireDefault(require("../../../hooks/__internal__/useInputAccessibility/useInputAccessibility"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -47,6 +49,7 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
   value,
   defaultValue,
   id,
+  label,
   name,
   disabled,
   readOnly,
@@ -77,7 +80,6 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
   ...props
 }, ref) => {
   const selectListId = (0, _react.useRef)((0, _guid.default)());
-  const labelId = (0, _react.useRef)((0, _guid.default)());
   const containerRef = (0, _react.useRef)();
   const listboxRef = (0, _react.useRef)();
   const filterTimer = (0, _react.useRef)();
@@ -91,6 +93,13 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
   const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
   const [textValue, setTextValue] = (0, _react.useState)("");
   const [selectedValue, setSelectedValue] = (0, _react.useState)(value || defaultValue || "");
+  const inputId = (0, _react.useRef)(id || (0, _guid.default)());
+  const {
+    labelId
+  } = (0, _useInputAccessibility.default)({
+    id: inputId.current,
+    label
+  });
 
   if (!deprecateInputRefWarnTriggered && inputRef) {
     deprecateInputRefWarnTriggered = true;
@@ -343,7 +352,7 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
 
   function getTextboxProps() {
     return {
-      id,
+      id: inputId.current,
       name,
       disabled,
       readOnly,
@@ -352,6 +361,8 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
       formattedValue: textValue,
       onClick: handleTextboxClick,
       iconOnClick: handleDropdownIconClick,
+      label,
+      labelId,
       onMouseDown: handleTextboxMouseDown,
       onFocus: handleTextboxFocus,
       onKeyDown: handleTextboxKeydown,
@@ -366,7 +377,7 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
   const selectList = /*#__PURE__*/_react.default.createElement(_selectList.default, {
     ref: listboxRef,
     id: selectListId.current,
-    labelId: labelId.current,
+    labelId: labelId,
     anchorElement: textboxRef && textboxRef.parentElement,
     onSelect: onSelectOption,
     onMouseDown: handleListMouseDown,
@@ -400,7 +411,6 @@ const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
   }, /*#__PURE__*/_react.default.createElement(_selectTextbox.default, _extends({
     "aria-controls": selectListId.current,
     activeDescendantId: activeDescendantId,
-    labelId: labelId.current,
     isOpen: isOpen,
     textboxRef: textboxRef
   }, getTextboxProps()))), selectList);

package/lib/components/settings-row/index.d.ts

@@ -1 +1,2 @@
-export { default } from "./settings-row";
+export { default } from "./settings-row.component";
+export type { SettingsRowProps } from "./settings-row.component";

package/lib/components/settings-row/settings-row.component.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { HeadingType } from "../heading";
+export interface SettingsRowProps extends MarginProps {
+    /**  A title for this group of settings. */
+    title?: string;
+    /** Defines the HTML heading element of the `title` within the component. */
+    headingType?: HeadingType;
+    /** Content to be rendered inside the component. */
+    children?: React.ReactNode;
+    /**  A string or JSX object that provides a short description about the group of settings. */
+    description?: React.ReactNode;
+    /** Shows a divider below the component. */
+    divider?: boolean;
+    /**  The CSS classes to apply to the component. */
+    className?: string;
+}
+export declare const SettingsRow: {
+    ({ title, headingType, children, description, divider, className, ...rest }: SettingsRowProps): JSX.Element;
+    displayName: string;
+};
+export default SettingsRow;

package/lib/components/settings-row/settings-row.component.js

@@ -3,14 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.SettingsRow = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _propTypes2 = _interopRequireDefault(require("@styled-system/prop-types"));
-
 var _heading = _interopRequireDefault(require("../heading"));
 
 var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags/tags"));
@@ -23,15 +21,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
-
 const SettingsRow = ({
   title,
   headingType = "h3",
-  description,
   children,
-  className,
+  description,
   divider = true,
+  className,
   ...rest
 }) => {
   const heading = () => {
@@ -53,25 +49,169 @@ const SettingsRow = ({
   }, (0, _utils.filterStyledSystemMarginProps)(rest)), /*#__PURE__*/_react.default.createElement(_settingsRow.StyledSettingsRowHeader, null, heading()), /*#__PURE__*/_react.default.createElement(_settingsRow.StyledSettingsRowInput, null, children));
 };
 
-SettingsRow.propTypes = { ...marginPropTypes,
-
-  /**  This component supports children. */
-  children: _propTypes.default.node,
-
-  /**  The CSS classes to apply to the component. */
-  className: _propTypes.default.string,
-
-  /**  A title for this group of settings. */
-  title: _propTypes.default.string,
-
-  /** Defines the HTML heading element of the `title` within the component. */
-  headingType: _propTypes.default.oneOf(["h1", "h2", "h3", "h4", "h5"]),
-
-  /**  A string or JSX object that provides a short description about the group of settings. */
-  description: _propTypes.default.node,
-
-  /** Shows a divider below the component. */
-  divider: _propTypes.default.bool
+exports.SettingsRow = SettingsRow;
+SettingsRow.propTypes = {
+  "children": _propTypes.default.node,
+  "className": _propTypes.default.string,
+  "description": _propTypes.default.node,
+  "divider": _propTypes.default.bool,
+  "headingType": _propTypes.default.oneOf(["h1", "h2", "h3", "h4", "h5"]),
+  "m": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "margin": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginBottom": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginLeft": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginRight": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginTop": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginX": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginY": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mb": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "ml": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mr": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mt": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mx": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "my": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "title": _propTypes.default.string
 };
+SettingsRow.displayName = "SettingsRow";
 var _default = SettingsRow;
 exports.default = _default;

package/lib/components/settings-row/settings-row.style.d.ts

@@ -0,0 +1,7 @@
+interface DividerProps {
+    hasDivider: boolean;
+}
+export declare const StyledSettingsRow: import("styled-components").StyledComponent<"div", any, DividerProps, never>;
+export declare const StyledSettingsRowHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledSettingsRowInput: import("styled-components").StyledComponent<"div", any, {}, never>;
+export {};

package/lib/components/textarea/textarea.component.d.ts

@@ -4,6 +4,8 @@ import { IconType } from "../icon";
 import { ValidationProps } from "../../__internal__/validations";
 import { CommonInputProps } from "../../__internal__/input";
 export interface TextareaProps extends ValidationProps, MarginProps, Omit<CommonInputProps, "size"> {
+    /** Prop to specify the aria-labelledby property of the component */
+    "aria-labelledby"?: string;
     /** Identifier used for testing purposes, applied to the root element of the component. */
     "data-component"?: string;
     /** Identifier used for testing purposes, applied to the root element of the component. */

package/lib/components/textarea/textarea.component.js

@@ -52,6 +52,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 let deprecateInputRefWarnTriggered = false;
 
 const Textarea = /*#__PURE__*/_react.default.forwardRef(({
+  "aria-labelledby": ariaLabelledBy,
   autoFocus,
   fieldHelp,
   label,
@@ -137,8 +138,7 @@ const Textarea = /*#__PURE__*/_react.default.forwardRef(({
     labelId,
     validationIconId,
     fieldHelpId,
-    ariaDescribedBy,
-    ariaLabelledBy
+    ariaDescribedBy
   } = (0, _useInputAccessibility.default)({
     id,
     error,

package/lib/components/textbox/textbox.component.d.ts

@@ -4,6 +4,8 @@ import { CommonInputProps } from "../../__internal__/input";
 import { ValidationProps } from "../../__internal__/validations";
 import { IconType } from "../icon";
 export interface CommonTextboxProps extends ValidationProps, MarginProps, Omit<CommonInputProps, "size"> {
+    /** Prop to specify the aria-labelledby property of the component */
+    "aria-labelledby"?: string;
     /** Identifier used for testing purposes, applied to the root element of the component. */
     "data-component"?: string;
     /** Identifier used for testing purposes, applied to the root element of the component. */
@@ -21,7 +23,11 @@ export interface CommonTextboxProps extends ValidationProps, MarginProps, Omit<C
      * real value is an ID but you want to show a human-readable version.
      */
     formattedValue?: string;
-    /** Unique identifier for the input. Will use a randomly generated GUID if none is provided */
+    /**
+     * Unique identifier for the input.
+     * Label id will be based on it, using following pattern: <id>-label.
+     * Will use a randomly generated GUID if none is provided.
+     */
     id?: string;
     /** Type of the icon that will be rendered next to the input */
     inputIcon?: IconType;
@@ -84,8 +90,6 @@ export interface TextboxProps extends CommonTextboxProps {
     isOptional?: boolean;
     /** Container for DatePicker or SelectList components */
     positionedChildren?: React.ReactNode;
-    /** Label id passed from Select component */
-    labelId?: string;
     /** Character limit of the textarea */
     characterLimit?: string | number;
     /** Stop the user typing over the characterLimit */

package/lib/components/textbox/textbox.component.js

@@ -52,13 +52,13 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 let deprecateInputRefWarnTriggered = false;
 
 const Textbox = /*#__PURE__*/_react.default.forwardRef(({
+  "aria-labelledby": ariaLabelledBy,
   align = "left",
   autoFocus,
   children,
   disabled,
   inputIcon,
   leftChildren,
-  labelId: externalLabelId,
   label,
   labelAlign,
   labelHelp,
@@ -127,7 +127,7 @@ const Textbox = /*#__PURE__*/_react.default.forwardRef(({
   }
 
   const {
-    labelId: internalLabelId,
+    labelId,
     validationIconId,
     fieldHelpId,
     ariaDescribedBy
@@ -139,7 +139,6 @@ const Textbox = /*#__PURE__*/_react.default.forwardRef(({
     label,
     fieldHelp
   });
-  const labelId = label ? externalLabelId || internalLabelId : "";
   const hasIconInside = !!(inputIcon || validationIconId && !validationOnLabel);
 
   const input = /*#__PURE__*/_react.default.createElement(_input.InputPresentation, {
@@ -162,7 +161,7 @@ const Textbox = /*#__PURE__*/_react.default.forwardRef(({
   }, {
     align: align,
     "aria-invalid": !!error,
-    "aria-labelledby": labelId,
+    "aria-labelledby": ariaLabelledBy,
     "aria-describedby": validationRedesignOptIn ? undefined : ariaDescribedBy,
     autoFocus: autoFocus,
     deferTimeout: deferTimeout,
@@ -356,7 +355,6 @@ Textbox.propTypes = {
   "label": _propTypes.default.string,
   "labelAlign": _propTypes.default.oneOf(["left", "right"]),
   "labelHelp": _propTypes.default.node,
-  "labelId": _propTypes.default.string,
   "labelInline": _propTypes.default.bool,
   "labelSpacing": _propTypes.default.oneOf([1, 2]),
   "labelWidth": _propTypes.default.number,

package/lib/hooks/__internal__/useInputAccessibility/useInputAccessibility.d.ts

@@ -11,5 +11,4 @@ export default function useInputAccessibility({ id, error, warning, info, label,
     validationIconId?: string;
     fieldHelpId?: string;
     ariaDescribedBy?: string;
-    ariaLabelledBy?: string;
 };

package/lib/hooks/__internal__/useInputAccessibility/useInputAccessibility.js

@@ -17,12 +17,10 @@ function useInputAccessibility({
   const validationIconId = [error, warning, info].filter(validation => validation && typeof validation === "string").length ? `${id}-validation-icon` : undefined;
   const fieldHelpId = fieldHelp ? `${id}-field-help` : undefined;
   const ariaDescribedBy = [fieldHelpId, validationIconId].filter(Boolean).join(" ");
-  const ariaLabelledBy = labelId;
   return {
     labelId,
     validationIconId,
     fieldHelpId,
-    ariaDescribedBy,
-    ariaLabelledBy
+    ariaDescribedBy
   };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "114.18.2",
+  "version": "115.0.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",

package/esm/components/draggable/draggable-container.d.ts

@@ -1,28 +0,0 @@
-import * as React from "react";
-import { DraggableItemProps } from "./draggable-item";
-
-type DraggableContainerChild =
-  | React.ReactElement<DraggableItemProps>
-  | boolean
-  | null
-  | undefined;
-
-export interface DraggableContainerProps {
-  /** Callback fired when order is changed */
-  getOrder?: (
-    draggableItemIds: (number | string)[],
-    movedItemId: string | number
-  ) => void;
-  /**
-   * The content of the component
-   *
-   * `<DraggableItem />` is required to make `Draggable` works
-   */
-  children?: DraggableContainerChild | DraggableContainerChild[];
-}
-
-declare function DraggableContainer(
-  props: DraggableContainerProps
-): JSX.Element;
-
-export default DraggableContainer;