@atlaskit/onboarding/dist/types/components/spotlight-target.d.ts

An onboarding spotlight introduces new features to users through focused messages or multi-step tours.

import React, { type ReactNode } from 'react';
import { type TargetRef } from './spotlight-manager';
type RenderChildrenFunction = (props: {
    /**
     * Pass this as the `ref` of the element that should be cloned.
     *
     * This is useful if:
     *
     * - you don't want a wrapping `<div>`
     * - a component exposes specific children through ref props
     *
     * @example
     * ```tsx
     * <SpotlightTarget>
     *   {({ targetRef }) => (
     *     <OpaqueComponent
     *       headingRef={targetRef}
     *     />
     *   )}
     * </SpotlightTarget>
     * ```
     */
    targetRef?: TargetRef;
}) => ReactNode;
interface SpotlightTargetProps {
    /**
     * A single child.
     */
    children: ReactNode | RenderChildrenFunction;
    /**
     * The name to reference from Spotlight.
     */
    name: string;
}
/**
 * __Spotlight target__
 *
 * A spotlight target marks a component to be used for introducing new features to users through focused messages or multi-step tours.
 *
 * - [Examples](https://atlassian.design/components/onboarding/examples)
 * - [Code](https://atlassian.design/components/onboarding/code)
 * - [Usage](https://atlassian.design/components/onboarding/usage)
 *
 * @deprecated Use `@atlaskit/spotlight` instead.
 */
declare const SpotlightTarget: {
    ({ children, name }: SpotlightTargetProps): React.JSX.Element;
    displayName: string;
};
export default SpotlightTarget;