diff --git a/apis/nucleus/src/components/listbox/components/ListBoxRowColumn/ListBoxRowColumn.jsx b/apis/nucleus/src/components/listbox/components/ListBoxRowColumn/ListBoxRowColumn.jsx index 59e98c7c0..852f60a8d 100644 --- a/apis/nucleus/src/components/listbox/components/ListBoxRowColumn/ListBoxRowColumn.jsx +++ b/apis/nucleus/src/components/listbox/components/ListBoxRowColumn/ListBoxRowColumn.jsx @@ -17,6 +17,7 @@ import Histogram from './components/Histogram'; import Frequency from './components/Frequency'; import ItemGrid from './components/ItemGrid'; import getCellFromPages from './helpers/get-cell-from-pages'; +import rtlUtil from '../../../../utils/rtl-util'; function RowColumn({ index, rowIndex, columnIndex, style, data }) { const { @@ -136,7 +137,7 @@ function RowColumn({ index, rowIndex, columnIndex, style, data }) { const isGridCol = dataLayout === 'grid' && layoutOrder === 'column'; const label = cell?.qText ?? ''; - + const textDirection = rtlUtil.detectTextDirection(label); // Search highlights. Split up labelText span into several and add the highlighted class to matching sub-strings. let labels; @@ -230,6 +231,7 @@ function RowColumn({ index, rowIndex, columnIndex, style, data }) { isGridCol={isGridCol} isSingleSelect={isSingleSelect} valueTextAlign={valueTextAlign} + textDirection={textDirection} /> ) : ( +
{labels.map(([label, highlighted], index) => { const key = `${index}`; return ( @@ -18,7 +18,7 @@ function LabelsWithRanges({ labels, dense, showGray, checkboxes }) { /> ); })} - +
); } @@ -35,8 +35,17 @@ function FieldWithRanges({ isGridCol, isSingleSelect, valueTextAlign, + textDirection, }) { - const LWR = ; + const LWR = ( + + ); return checkboxes ? (