@thecb/components 11.1.15-beta.2 → 11.1.15-beta.4

package/dist/index.esm.js

@@ -26850,7 +26850,7 @@ var fallbackValues$n = {
 };
 
 var _excluded$y = ["showErrors", "themeValues"],
-  _excluded2 = ["type", "labelDisplayOverride", "labelTextWhenNoError", "errorMessages", "isNum", "isEmail", "helperModal", "field", "fieldActions", "showErrors", "formatter", "decorator", "themeValues", "background", "customHeight", "autocompleteValue", "extraStyles", "removeFromValue", "dataQa", "isRequired", "errorFieldExtraStyles", "showFieldErrorRow", "labelTextVariant", "errorTextVariant"];
+  _excluded2 = ["ariaLabelledBy", "type", "labelDisplayOverride", "labelTextWhenNoError", "errorMessages", "isNum", "isEmail", "helperModal", "field", "fieldActions", "showErrors", "formatter", "decorator", "themeValues", "background", "customHeight", "autocompleteValue", "extraStyles", "removeFromValue", "dataQa", "isRequired", "errorFieldExtraStyles", "showFieldErrorRow", "labelTextVariant", "errorTextVariant"];
 var InputField = styled.input.withConfig({
   displayName: "FormInput__InputField",
   componentId: "sc-l094r1-0"
@@ -26911,7 +26911,9 @@ var FormattedInputField = styled(function (_ref8) {
   return css(["", ""], extraStyles);
 });
 var FormInput = function FormInput(_ref15) {
-  var _ref15$type = _ref15.type,
+  var _ref15$ariaLabelledBy = _ref15.ariaLabelledBy,
+    ariaLabelledBy = _ref15$ariaLabelledBy === void 0 ? undefined : _ref15$ariaLabelledBy,
+    _ref15$type = _ref15.type,
     type = _ref15$type === void 0 ? "text" : _ref15$type,
     _ref15$labelDisplayOv = _ref15.labelDisplayOverride,
     labelDisplayOverride = _ref15$labelDisplayOv === void 0 ? null : _ref15$labelDisplayOv,
@@ -27018,7 +27020,7 @@ var FormInput = function FormInput(_ref15) {
   }, decorator)))), /*#__PURE__*/React.createElement(Box, {
     padding: "0"
   }, formatter ? /*#__PURE__*/React.createElement(FormattedInputField, _extends({
-    "aria-labelledby": createIdFromString(labelTextWhenNoError),
+    "aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
     "aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
     "aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
     onChange: function onChange(value) {
@@ -27050,7 +27052,7 @@ var FormInput = function FormInput(_ref15) {
       }
     }
   }, props)) : /*#__PURE__*/React.createElement(InputField, _extends({
-    "aria-labelledby": createIdFromString(labelTextWhenNoError),
+    "aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
     "aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
     "aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
     onChange: function onChange(e) {
@@ -47585,22 +47587,28 @@ var PartialAmountField = function PartialAmountField(_ref) {
     moneyFormat = _ref.moneyFormat,
     fieldActions = _ref.fieldActions,
     themeValues = _ref.themeValues;
+  var id = createIdFromString("".concat(lineItem.description, "-").concat(lineItem.subDescription));
   return /*#__PURE__*/React.createElement(FormInput$1, {
-    labelTextWhenNoError: createIdFromString("".concat(lineItem.description, "-").concat(lineItem.subDescription)),
+    ariaLabelledBy: null,
+    id: id,
+    labelTextWhenNoError: id,
     labelDisplayOverride: /*#__PURE__*/React.createElement(Stack, {
       childGap: "0px"
-    }, /*#__PURE__*/React.createElement(Detail$1, {
+    }, /*#__PURE__*/React.createElement(Box, {
       as: "label",
-      "for": createIdFromString("".concat(lineItem.description, "-").concat(lineItem.subDescription)),
+      "for": id,
+      padding: "0"
+    }, /*#__PURE__*/React.createElement(Detail$1, {
+      as: "span",
+      extraStyles: "display: block;",
       variant: themeValues.detailVariant,
       weight: themeValues.weightTitle
-    }, /*#__PURE__*/React.createElement(Detail$1, {
+    }, lineItem.description), /*#__PURE__*/React.createElement(Detail$1, {
       as: "span",
+      extraStyles: "display: block;",
       variant: themeValues.detailVariant,
       weight: "400"
-    }, lineItem.subDescription), /*#__PURE__*/React.createElement(Box, {
-      padding: "0"
-    }, lineItem.description))),
+    }, lineItem.subDescription))),
     key: lineItem.id,
     field: field,
     fieldActions: fieldActions,