[SalesForce] CSS doesn’t get applied on lightning-datatable cell in LWC using cellAttributes

I have created a LWC which lists data into a component using lightning datatable. The data gets displayed correctly

Further, I am trying to format one particular column to display the values with bold font.

Below is the css code which I am using.

.contentClass {
    font-weight: bold;
}

Below is the JS file code to format columns:

const COLS = [ 
    { label: 'Month', fieldName: 'Schedule_Date__c', type: "date",
    typeAttributes:{
        year: "numeric",
        month: "long"
    }}, 
    { label: 'Amount', fieldName: 'Amount__c',editable: true,cellAttributes: { class: 'contentClass' }}
];

The table has two columns, Date and Amount. Date formatting using typeAttributes work fine.

For displaying Amount in bold font. I have added the cellAttributes with class name specified in the css file.

However the Amount cell doesn't get formatted.

One tweak makes this work, i.e. if I include the class in html file. The cell formatting is reflected and the Amount Cell data appears in bold font.

Below is the excerpt of HTML file code, where I explicitly add contentClass in the div tag.

<div class="slds-m-around_medium contentClass">
    <template if:true={revenueSch.data}>
        <lightning-datatable
            key-field="Id"
            data={result.data}
            columns={columns}
            onsave={handleSave}
            draft-values={draftValues} 
            hide-checkbox-column="true"
            show-row-number-column="false">
        </lightning-datatable>
    </template>
    <template if:true={result.error}>
        <!-- handle Apex error -->
    </template>
</div>

Is this a bug, wherein the lwc component expects the class to be part of some html tag? Or am I specifying the cellAtrributes incorrectly? Any insights here would help!

Best Answer

The custom classes cannot be applied to cell attributes. Please refer to the salesforce ref. document.

https://developer.salesforce.com/docs/component-library/bundle/lightning-datatable/documentation