SchedulerTooltipProps

Configures the appearance, behavior, and interaction of tooltips displayed over scheduler events and cells. Provides granular control over tooltip positioning, animation, and custom content rendering for enhanced user guidance. Enables customization of tooltip dimensions, open modes, and interactive behaviors through flexible property configuration.

Props

The following table outlines the props for the SchedulerTooltipProps:

NameTypeDefaultDescription
animation
TooltipAnimationOptions
{ open: { effect: 'FadeIn', duration: 150, delay: 0 }, close: { effect: 'FadeOut', duration: 150, delay: 0 } }

Specifies animation settings for Tooltip open and close actions. Enables smooth transitions with configurable effects, duration, and delay.

arrow
boolean
false

When enabled, displays a small arrow/pointer showing the direction of the Tooltip relative to its target. Enhances visual clarity of tooltip positioning.

content
node | Function
-

Specifies the content of the Tooltip component (text, HTML, or custom React component). Can be a static string or a dynamically rendered component.

followCursor
boolean
false

When enabled, the Tooltip follows the mouse pointer movement over the target element. Provides dynamic tooltip positioning based on cursor location.

height
string | number
'auto'

Specifies the height of the Tooltip component in pixels or CSS units. Use 'auto' for automatic height based on content.

open
boolean
false

Controls the Tooltip's visibility state: true to display, false to hide completely. Allows programmatic control over tooltip visibility.

opensOn
string
'Auto'

Specifies the device mode to display the Tooltip content. Set of open modes available for Tooltip.

  • Auto :- The Tooltip opens automatically when the trigger element is hovered over.
  • Hover :- The Tooltip opens when the trigger element is hovered over.
  • Click :- The Tooltip opens when the trigger element is clicked.
  • Focus :- The Tooltip opens when the trigger element is focused.
  • Custom :- The Tooltip opens when the trigger element is triggered by a custom event.
position
Position
'TopCenter'

Specifies the vertical and horizontal position of the Tooltip relative to the target element. Options: 'TopCenter', 'TopLeft', 'TopRight', 'BottomCenter', 'BottomLeft', 'BottomRight', etc.

sticky
boolean
false

When enabled, the Tooltip remains in an open state until manually closed by the user. Provides persistent tooltip display for important information.

width
string | number
'auto'

Specifies the width of the Tooltip component in pixels or CSS units. Use 'auto' for automatic width based on content.

Events

The following table outlines the events for the SchedulerTooltipProps:

NameTypeDescription
onClose
(event: Event) => void

Triggers before the Tooltip hides from the screen.

onFilterTarget
(event: HTMLElement) => HTMLElement

Specifies a callback function that determines the target elements on which the Tooltip should be displayed. This can be used for showing Tooltip with multiple targets.

onOpen
(event: Event) => void

Triggers before the Tooltip is displayed over the target element.