@workday/canvas-kit-react/dist/commonjs/tooltip/lib/Tooltip.d.ts

The parent module that contains all Workday Canvas Kit React components

import * as React from 'react';
import { Placement } from '@workday/canvas-kit-react/popup';
export interface TooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
    /**
     * This should be a string in most cases. HTML is supported, but only text is understood
     * by assistive technology. This is true for both `label` and `describe` modes.
     *
     * **Note:** If you use `description` type and want to pass `jsx`, it **must* be inline and **not** a component to ensure the inner text is properly translated.
     *
     * ```jsx
     * // The text will be understood as: You must accept terms and conditions
     * <Tooltip type="description" title={<span>You<i>must</i> accept terms and conditions</span>}/>
     *
     * // This will render a string including the html and will not be properly understood by voice over.
     * const MyComponent = () => <span>You<i>must</i> accept terms and conditions</span>
     * <Tooltip type="description" title={MyComponent/>
     * ```
     */
    title: React.ReactNode;
    /**
     * The target (anchor element) for the Tooltip.
     *
     * **Note:** This **must** be a single Element, StyledComponent, or any other component that
     * forwards extra props to an Element. Tooltip works running `React.cloneElement` on the children
     * and adds extra properties like aria attributes and event handlers. This is currently a
     * limitation of the Tooltip component. Functionality will not work if this condition isn't met.
     */
    children: React.ReactElement<any>;
    /**
     * Sets the placement preference used by PopperJS.
     * @default 'top'
     */
    placement?: Placement;
    /**
     * Define fallback placements by providing a list of {@link Placement} in array (in order of preference).
     * The default preference is following the order of `top`, `right`, `bottom`, and `left`. Once the initial
     * and opposite placements are not available, the fallback placements will be in use. Use an empty array to
     * disable the fallback placements.
     */
    fallbackPlacements?: Placement[];
    /**
     * Determines the tooltip type for accessibility.
     *
     * - `label`: Sets the accessible name for the wrapped element. Use for icons or if tooltip
     *   `title` prop is the same as the text content of the wrapped element. E.g. TertiaryButtons that render an icon or
     *   Ellipsis tooltips.
     * - **Deprecated: `describe` is deprecated, please use `description`**.`describe`: Sets `aria-describedby` of the wrapped element. Use if the tooltip has additional
     *   information about the target.
     * - `muted`: No effort is made to make the tooltip accessible to screen readers. Use if the
     *   tooltip contents are not useful to a screen reader or if you have handled accessibility of
     *   the tooltip yourself.
     *
     * **Note**: Assistive technology may ignore `describe` techniques based on verbosity settings.
     * Consider an alternate way to inform a user of additional important information.
     * @default 'label'
     */
    type?: 'label' | 'describe' | 'muted' | 'description';
    /**
     * Amount of time (in ms) to delay before showing the tooltip
     */
    showDelay?: number;
    /**
     * Amount of time (in ms) to delay before hiding the tooltip
     */
    hideDelay?: number;
}
export declare const Tooltip: import("@workday/canvas-kit-react/common").ElementComponent<"div", TooltipProps>;
//# sourceMappingURL=Tooltip.d.ts.map