@thecb/components 11.1.6-beta.0 → 11.1.7-beta.0

package/package.json

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

package/src/components/molecules/collapsible-section/CollapsibleSection.js

@@ -37,7 +37,7 @@ const CollapsibleSection = ({
   const numChildren = typeof children === "Array" ? children.length : 1;
   const label =
     name !== "" ? name : !customTitle ? title : "collapsible section";
-  const id = `${label?.replaceAll?.(" ", "-")?.toLowerCase()}-${index}`;
+  const id = `${label?.replaceAll(" ", "-")?.toLowerCase()}-${index}`;
 
   const wrapper = {
     open: {

package/src/components/molecules/obligation/Obligation.js

@@ -45,7 +45,8 @@ const Obligation = ({
   cartConfig = undefined,
   multiCartParams = undefined,
   isInCart = false,
-  isLoading = false
+  isLoading = false,
+  showRemoveButton = true
 }) => {
   /*
     The value of obligations is always an array. It can contain:
@@ -345,6 +346,7 @@ const Obligation = ({
                   subDescription={subDescription}
                   allowedPaymentInstruments={allowedPaymentInstruments}
                   disableActions={isInCustomerManagement}
+                  showRemoveButton={showRemoveButton}
                 />
               )}
             </Cluster>
@@ -368,6 +370,7 @@ const Obligation = ({
               subDescription={subDescription}
               allowedPaymentInstruments={allowedPaymentInstruments}
               disableActions={isInCustomerManagement}
+              showRemoveButton={showRemoveButton}
             />
           )}
         </Stack>

package/src/components/molecules/obligation/Obligation.stories.js

@@ -420,7 +420,8 @@ export const InactiveObligation = {
     inactive: true,
     inactiveLookupInput: undefined,
     inactiveLookupTitle: "Health Service System",
-    inactiveLookupValue: "012856"
+    inactiveLookupValue: "012856",
+    showRemoveButton: true
   },
   render: args => (
     <Box minWidth="800px">

package/src/components/molecules/obligation/modules/InactiveControlsModule.js

@@ -22,7 +22,8 @@ const InactiveControlsModule = ({
   description,
   subDescription,
   allowedPaymentInstruments,
-  disableActions = false
+  disableActions = false,
+  showRemoveButton = true
 }) => {
   const [modalOpen, toggleModal] = useState(false);
   const { deleteObligationAssoc } = actions;
@@ -63,15 +64,17 @@ const InactiveControlsModule = ({
             />
           </Box>
         )}
-        <Box padding="0" extraStyles={`flex-grow: 1;`}>
-          <RemoveAccountModalModule
-            agencyName={agencyName}
-            removeAccount={disableActions ? noop : handleRemoveAccount}
-            accountType={configType === "ACCOUNT" ? "Account" : "Property"}
-            isMobile={isMobile}
-            disableActions={disableActions}
-          />
-        </Box>
+        {showRemoveButton && (
+          <Box padding="0" extraStyles={`flex-grow: 1;`}>
+            <RemoveAccountModalModule
+              agencyName={agencyName}
+              removeAccount={disableActions ? noop : handleRemoveAccount}
+              accountType={configType === "ACCOUNT" ? "Account" : "Property"}
+              isMobile={isMobile}
+              disableActions={disableActions}
+            />
+          </Box>
+        )}
       </Cluster>
     </Box>
   );