Feature request - tooltip minimal prop and flexibility over arrow

packages/core/src/components/popover/popover.tsx

@@ -75,14 +75,6 @@ export interface IPopoverProps extends IPopoverSharedProps {
      */
     hasBackdrop?: boolean;
 
-    /**
-     * Whether to apply minimal styles to this popover, which includes removing
-     * the arrow and adding `Classes.MINIMAL` to minimize and accelerate the
-     * transitions.
-     * @default false
-     */
-    minimal?: boolean;
-
     /**
      * Ref supplied to the `Classes.POPOVER` element.
      */

packages/core/src/components/popover/popoverSharedProps.ts

@@ -95,6 +95,13 @@ export interface IPopoverSharedProps extends IOverlayableProps, IProps {
      */
     isOpen?: boolean;
 
+    /**
+     * Whether to apply minimal styling to this popover or tooltip. Minimal popovers
+     * do not have an arrow pointing to their target and use a subtler animation.
+     * @default false
+     */
+    minimal?: boolean;
+
     /**
      * Popper modifier options, passed directly to internal Popper instance. See
      * https://popper.js.org/docs/modifiers/ for complete

packages/core/src/components/tooltip/tooltip.tsx

@@ -70,18 +70,25 @@ export class Tooltip extends AbstractPureComponent2<ITooltipProps> {
     public static defaultProps: Partial<ITooltipProps> = {
         hoverCloseDelay: 0,
         hoverOpenDelay: 100,
+        minimal: false,
         transitionDuration: 100,
     };
 
     private popover: Popover | null = null;
 
     public render() {
         const { children, intent, popoverClassName, ...restProps } = this.props;
-        const classes = classNames(Classes.TOOLTIP, Classes.intentClass(intent), popoverClassName);
+        const classes = classNames(
+            Classes.TOOLTIP,
+            { [Classes.MINIMAL]: this.props.minimal },
+            Classes.intentClass(intent),
+            popoverClassName,
+        );
 
         return (
             <Popover
                 interactionKind={PopoverInteractionKind.HOVER_TARGET_ONLY}
+                modifiers={{ arrow: { enabled: !this.props.minimal } }}
                 {...restProps}
                 autoFocus={false}
                 canEscapeKeyClose={false}

packages/core/test/tooltip/tooltipTests.tsx

@@ -51,6 +51,20 @@ describe("<Tooltip>", () => {
         assert.isTrue(onOpening.calledOnce);
     });
 
+    it("applies minimal class & hides arrow when minimal is true", () => {
+        const tooltip = renderTooltip({ isOpen: true, minimal: true });
+        assert.isTrue(tooltip.find(TOOLTIP_SELECTOR).hasClass(Classes.MINIMAL));
+        assert.isFalse(tooltip.find(Popover).props().modifiers!.arrow!.enabled);
+    });
+
+    it("does not apply minimal class & shows arrow when minimal is false", () => {
+        const tooltip = renderTooltip({ isOpen: true });
+        // Minimal should be false by default.
+        assert.isFalse(tooltip.props().minimal);
+        assert.isFalse(tooltip.find(TOOLTIP_SELECTOR).hasClass(Classes.MINIMAL));
+        assert.isTrue(tooltip.find(Popover).props().modifiers!.arrow!.enabled);
+    });
+
     describe("in uncontrolled mode", () => {
         it("defaultIsOpen determines initial open state", () => {
             assert.lengthOf(renderTooltip({ defaultIsOpen: true }).find(TOOLTIP_SELECTOR), 1);

packages/docs-app/src/examples/core-examples/tooltipExample.tsx

@@ -55,6 +55,16 @@ export class TooltipExample extends React.PureComponent<IExampleProps, { isOpen:
                         is disabled.
                     </Tooltip>
                 </div>
+                <div>
+                    This line's tooltip{" "}
+                    <Tooltip
+                        className={Classes.TOOLTIP_INDICATOR}
+                        content={<span>This tooltip has the minimal style applied!</span>}
+                        minimal={true}
+                    >
+                        is minimal.
+                    </Tooltip>
+                </div>
                 <div>
                     This line's tooltip{" "}
                     <Tooltip