feat(components): added hover actions to RowItem

GitOrigin-RevId: a241acc95631f0d88918be1676c21946d3730dbe
plasmicapp · Nov 8, 2024 · 823bad7 · 823bad7
1 parent 2c9ddcc
commit 823bad7
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/platform/wab/src/wab/client/components/RowItem.tsx b/platform/wab/src/wab/client/components/RowItem.tsx
@@ -12,16 +12,26 @@ export interface RowItemProps extends DefaultRowItemProps {
   style?: React.CSSProperties;
   menu?: MenuType;
   onClick?: () => void;
+  showActionsOnHover?: boolean;
 }
 
 function RowItem_(props: RowItemProps, ref: HTMLElementRefOf<"div">) {
-  const { style, menu, menuSize, onClick, ...rest } = props;
+  const { style, menu, menuSize, onClick, showActionsOnHover, ...rest } = props;
+  const [hover, setHover] = React.useState(false);
   const contextMenuProps = useContextMenu({ menu });
 
   return (
     <PlasmicRowItem
       {...rest}
-      root={{ ref, style, onClick, ...contextMenuProps }}
+      root={{
+        ref,
+        style,
+        onMouseEnter: () => setHover(true),
+        onMouseLeave: () => setHover(false),
+        onClick,
+        ...contextMenuProps,
+      }}
+      showActions={props.showActions || (showActionsOnHover && hover)}
       menuButton={{ props: { ...contextMenuProps, size: menuSize } }}
     />
   );