@carbon/react/lib/components/Toggletip/index.d.ts

React components for the Carbon Design System

/**
 * Copyright IBM Corp. 2016, 2025
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
import PropTypes from 'prop-types';
import React, { type ElementType, type ReactNode } from 'react';
import { type PopoverAlignment } from '../Popover';
import { PolymorphicProps } from '../../types/common';
import { PolymorphicComponentPropWithRef } from '../../internal/PolymorphicProps';
type ToggletipLabelProps<E extends ElementType> = {
    as?: E;
    children?: ReactNode;
    className?: string;
} & Omit<React.ComponentPropsWithoutRef<E>, 'as' | 'children' | 'className'>;
/**
 * Used to render the label for a Toggletip
 */
export declare function ToggletipLabel<E extends ElementType>({ as: BaseComponent, children, className: customClassName, ...rest }: ToggletipLabelProps<E>): import("react/jsx-runtime").JSX.Element;
export declare namespace ToggletipLabel {
    var propTypes: {
        /**
         * Provide a custom element or component to render the top-level node for the
         * component.
         */
        as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
        /**
         * Custom children to be rendered as the content of the label
         */
        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
         * Provide a custom class name to be added to the outermost node in the
         * component
         */
        className: PropTypes.Requireable<string>;
    };
}
export interface ToggletipBaseProps {
    align?: PopoverAlignment;
    alignmentAxisOffset?: number;
    autoAlign?: boolean;
    className?: string;
    children?: ReactNode;
    defaultOpen?: boolean;
}
export type ToggletipProps<T extends ElementType> = PolymorphicComponentPropWithRef<T, ToggletipBaseProps>;
/**
 * Used as a container for the button and content of a toggletip. This component
 * is responsible for coordinating between interactions with the button and the
 * visibility of the content
 */
export declare function Toggletip<E extends ElementType = 'span'>({ align, as, autoAlign, className: customClassName, children, defaultOpen, ...rest }: ToggletipProps<E>): import("react/jsx-runtime").JSX.Element;
export declare namespace Toggletip {
    var propTypes: {
        /**
         * Specify how the toggletip should align with the button
         */
        align: PropTypes.Requireable<string>;
        /**
         * Provide an offset value for alignment axis.
         */
        alignmentAxisOffset: PropTypes.Requireable<number>;
        /**
         * Provide a custom element or component to render the top-level node for the
         * component.
         */
        as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
        /**
         * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
         */
        autoAlign: PropTypes.Requireable<boolean>;
        /**
         * Custom children to be rendered as the content of the label
         */
        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
         * Provide a custom class name to be added to the outermost node in the
         * component
         */
        className: PropTypes.Requireable<string>;
        /**
         * Specify if the toggletip should be open by default
         */
        defaultOpen: PropTypes.Requireable<boolean>;
    };
}
export interface ToggletipButtonBaseProps {
    children?: ReactNode;
    className?: string;
    label?: string;
}
export type ToggleTipButtonProps<T extends React.ElementType> = PolymorphicProps<T, ToggletipButtonBaseProps>;
/**
 * `ToggletipButton` controls the visibility of the Toggletip through mouse
 * clicks and keyboard interactions.
 */
export declare const ToggletipButton: React.ForwardRefExoticComponent<Omit<ToggleTipButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
export interface ToggletipContentProps {
    children?: ReactNode;
    className?: string;
}
/**
 * `ToggletipContent` is a wrapper around `PopoverContent`. It places the
 * `children` passed in as a prop inside of `PopoverContent` so that they will
 * be rendered inside of the popover for this component.
 */
declare const ToggletipContent: React.ForwardRefExoticComponent<ToggletipContentProps & React.RefAttributes<HTMLDivElement>>;
export { ToggletipContent };
export interface ToggleTipActionsProps {
    children?: ReactNode;
    className?: string;
}
/**
 * `ToggletipActions` is a container for one or two actions present at the base
 * of a toggletip. It is used for layout of these items.
 */
export declare function ToggletipActions({ children, className: customClassName, }: ToggleTipActionsProps): import("react/jsx-runtime").JSX.Element;
export declare namespace ToggletipActions {
    var propTypes: {
        /**
         * Custom children to be rendered as the content of the label
         */
        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
         * Provide a custom class name to be added to the outermost node in the
         * component
         */
        className: PropTypes.Requireable<string>;
    };
}