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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "11.1.15-beta.0",
+  "version": "11.1.15-beta.2",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "typings": "dist/index.d.ts",

package/src/components/molecules/partial-amount-form/PartialAmountField.js

@@ -1,8 +1,8 @@
 import React from "react";
 import { equals } from "ramda";
 import { FormInput } from "../../atoms/form-layouts";
-import { displayCurrency } from "../../../util/general";
-import { Stack, Detail, Text } from "../../atoms";
+import { createIdFromString, displayCurrency } from "../../../util/general";
+import { Stack, Detail, Text, Box } from "../../atoms";
 import { themeComponent } from "../../../util/themeUtils";
 import { fallbackValues } from "./PartialAmountField.theme";
 const PartialAmountField = ({
@@ -15,23 +15,23 @@ const PartialAmountField = ({
   themeValues
 }) => (
   <FormInput
-    labelTextWhenNoError={lineItem.description}
+    labelTextWhenNoError={createIdFromString(
+      `${lineItem.description}-${lineItem.subDescription}`
+    )}
     labelDisplayOverride={
       <Stack childGap="0px">
         <Detail
           as="label"
+          for={createIdFromString(
+            `${lineItem.description}-${lineItem.subDescription}`
+          )}
           variant={themeValues.detailVariant}
           weight={themeValues.weightTitle}
         >
-          <span>{lineItem.description}</span>
-        </Detail>
-        <Detail
-          id={lineItem.subDescription}
-          as="label"
-          variant={themeValues.detailVariant}
-          weight="400"
-        >
-          {lineItem.subDescription}
+          <Detail as="span" variant={themeValues.detailVariant} weight="400">
+            {lineItem.subDescription}
+          </Detail>
+          <Box padding="0">{lineItem.description}</Box>
         </Detail>
       </Stack>
     }