Enabled column title text truncation

bigbinary · Oct 17, 2024 · b59fcf1 · b59fcf1
1 parent 59dd20f
commit b59fcf1
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 7 deletions.
diff --git a/src/components/Table/components/HeaderCell/CellContent.jsx b/src/components/Table/components/HeaderCell/CellContent.jsx
@@ -41,8 +41,10 @@ const CellContent = ({
       title=""
       onClick={isSortable ? noop : headerProps.onClick}
     >
-      <div className="flex items-center justify-between">
-        <div className="min-w-0 flex-grow">{children}</div>
+      <div className="neeto-ui-flex neeto-ui-items-center neeto-ui-justify-between">
+        <div className="neeto-ui-min-w-0 neeto-ui-flex-grow neeto-ui-truncate">
+          {children}
+        </div>
         {hasMoreMenu && (
           <HeaderCellMenu
             {...{

diff --git a/src/components/Table/components/HeaderCell/HeaderCellMenu.jsx b/src/components/Table/components/HeaderCell/HeaderCellMenu.jsx
@@ -41,13 +41,13 @@ const HeaderCellMenu = ({
     <div onClick={event => event.stopPropagation()}>
       <Dropdown
         appendTo={() => document.body}
-        className="flex"
+        className="neeto-ui-flex"
         icon={MenuHorizontal}
         position="auto"
         strategy="fixed"
         zIndex={99999}
         buttonProps={{
-          className: "min-h-0 flex-shrink-0",
+          className: "neeto-ui-min-h-0 neeto-ui-flex-shrink-0",
           style: "text",
           size: "medium",
           "data-testid": "column-menu-button",
@@ -61,7 +61,7 @@ const HeaderCellMenu = ({
           {isSortable && (
             <>
               <MenuItem.Button
-                className="flex items-center justify-between"
+                className="neeto-ui-flex neeto-ui-items-center neeto-ui-justify-between"
                 onClick={() =>
                   onSort({
                     column,
@@ -78,7 +78,7 @@ const HeaderCellMenu = ({
                   )}
               </MenuItem.Button>
               <MenuItem.Button
-                className="flex items-center justify-between"
+                className="neeto-ui-flex neeto-ui-items-center neeto-ui-justify-between"
                 onClick={() =>
                   onSort({
                     column,

diff --git a/src/components/Table/components/SelectAllRowsCallout.jsx b/src/components/Table/components/SelectAllRowsCallout.jsx
@@ -15,7 +15,7 @@ const SelectAllRowsCallout = ({
     {...calloutProps}
     data-testid="select-all-rows-callout"
   >
-    <div className="flex space-x-3">
+    <div className="neeto-ui-flex neeto-ui-gap-3">
       <Typography style="body2">{selectAllRowMessage}</Typography>
       <Button
         data-testid="select-all-rows-button"