react-science 2.0.0 → 3.1.0

package/src/components/toolbar/Toolbar.tsx

@@ -8,12 +8,14 @@ import {
   PopoverProps,
   TagProps,
   Icon,
+  TooltipProps,
 } from '@blueprintjs/core';
 import { IconName } from '@blueprintjs/icons';
 import { css } from '@emotion/react';
 import {
   cloneElement,
   JSX,
+  MouseEvent,
   ReactElement,
   ReactNode,
   useLayoutEffect,
@@ -53,12 +55,16 @@ export interface ToolbarProps extends ToolbarBaseProps {
 
 export interface ToolbarItemProps extends ToolbarBaseProps {
   id?: string;
-  title: string;
+  tooltip?: TooltipProps['content'];
+  tooltipProps?: Omit<TooltipProps, 'content'>;
   icon: IconName | JSX.Element;
   active?: boolean;
-  onClick?: (item: ToolbarItemProps) => void;
+  onClick?: (
+    item: ToolbarItemProps & {
+      event: MouseEvent;
+    },
+  ) => void;
   className?: string;
-  noTooltip?: boolean;
   isPopover?: boolean;
   tag?: ReactNode;
   tagProps?: Omit<TagProps, 'children'>;
@@ -140,11 +146,11 @@ Toolbar.Item = function ToolbarItem(props: ToolbarItemProps) {
     active = false,
     icon,
     onClick,
-    title,
+    tooltip,
+    tooltipProps,
     id,
     intent: itemIntent,
     disabled: itemDisabled,
-    noTooltip = false,
     isPopover,
     ...other
   } = props;
@@ -165,6 +171,7 @@ Toolbar.Item = function ToolbarItem(props: ToolbarItemProps) {
             ? `${icon.props.className} bp5-icon`
             : 'bp5-icon',
         });
+
   return (
     <Button
       alignText={isPopover ? 'left' : undefined}
@@ -209,17 +216,19 @@ Toolbar.Item = function ToolbarItem(props: ToolbarItemProps) {
           )}
         </div>
       }
-      onClick={() => {
-        onClick?.(props);
+      onClick={(event) => {
+        onClick?.({ event, ...props });
       }}
       tooltipProps={
-        noTooltip
+        !tooltip
           ? undefined
           : {
-              content: title,
+              content: tooltip,
               placement: vertical ? 'right' : 'bottom',
               intent,
               compact: !large,
+              interactionKind: 'hover',
+              ...tooltipProps,
             }
       }
       {...other}
@@ -256,7 +265,7 @@ Toolbar.PopoverItem = function ToolbarPopoverItem(
       }}
       {...other}
     >
-      <Toolbar.Item noTooltip isPopover {...itemProps} />
+      <Toolbar.Item isPopover {...itemProps} />
     </Popover>
   );
 };