[ic-datatable]: Truncation functionality may be freezing UI on load

### Summary of the bug
I think the truncation tooltip functionality may be temporarily freezing the UI. This is dependent on the number of cells the truncation functionality has to be applied to.
I have created [Stackblitz](https://stackblitz.com/edit/h4j4x5ww?file=src%2Fapp.tsx) to demonstrate the performance tab reporting UI bottlenecks.

In order to see bottlenecks within the Performance tab:
1. Open the Stackblitx preview in a new tab
2. Open up the DevTools > Performance tab within the preview
3. Press the record button in the top left of the Performance tab
4. Refresh the preview page
5. Stop the recording after the page has reloaded.

On the left of the performances should be an Insights section suggesting there is an issue with the "forced reflow" of the UI. Clicking for more detail should adjust the flame chart to pinpoint the bottlenecks.

In addition to the functions on the left, I've also noticed other instances where `addLineClampCSS` is causing the bottleneck:

It looks like a "forced reflow" is due to querying an element, dynamically updating the styling of an element (i.e. setting a line-clamp), which forces the browser to make DOM updates then querying the element later on.

I was able to discover the UI freezing by trying to click on a navigation link in the side navigation bar while returning a large number of records from the API and applying truncation. This is more evident when throttling the Network request to 3G.

[Forced reflows](https://developer.chrome.com/docs/performance/insights/forced-reflow).

For the `addLineClamp` issue, it seems like the solution is to make batch updates to the truncated cells rather than applying the truncation / DOM updates per cell passed to the `[addLineClampCSS](https://github.com/mi6/ic-ui-kit/blob/main/packages/canary-web-components/src/components/ic-data-table/ic-data-table.tsx#L2146)` method.

```jsx
// Logically the code is doing something like
elements.forEach((element) => {
const height = element.scrollHeight;
element.style.height = `${height * 1.5}px`
});

// It may be better for performance if the updating is done in a batch
const height = elements.map((element) => element.scrollHeight);
elements.forEach((el, i) => {
element.style.height = `${height[i] * 1.5}px`
});
```

### 🖥 📱 Device
- Type: Desktop
- Device: Laptop
- OS version: Windows 11
- Browser version: Chrome 141

### 🧐 Expected behaviour
Reduced number of UI bottlenecks which prevent the UI from freezing up during truncation load

### 📝 Acceptance Criteria
If relevant, describe in full detail the different interactions and edge cases that the component or patterns needs to fulfil.

*Given that data within datatable is truncated*
*When the datatable loads*
*Then the UI should not freeze up*

### 🚨 Urgency (low, medium or high)
If applicable, tell us how urgent it is that this issue gets resolved, based on the impact it has on your team's work or project timeline.

Medium

### Additional info
Tell us anything else useful to help us fix or understand the problem.

Reproduce the report with the linked Stackblitz and Chrome DevTools Performance tab, especially with many returned records and a throttled 3G request. Then inspect addLineClampCSS in packages/canary-web-components/src/components/ic-data-table/ic-data-table.tsx and trace the related truncation calls. Done means the datatable loads without the reported UI freeze or forced-reflow bottlenecks while truncated data is displayed.

Written by the indexing model from the issue text.