@atlaskit/onboarding 14.6.1 → 15.0.0

package/dist/types-ts4.5/components/spotlight-dialog.d.ts

@@ -1,86 +0,0 @@
-import React, { Component, type ComponentType, type ReactNode } from 'react';
-import { type Actions } from '../types';
-interface SpotlightDialogProps {
-    /**
-     * Buttons to render in the footer.
-     */
-    actions?: Actions;
-    /**
-     * An optional element rendered beside the footer actions.
-     */
-    actionsBeforeElement?: ReactNode;
-    /**
-     * The elements rendered in the modal.
-     */
-    children?: ReactNode;
-    /**
-     * Where the dialog should appear, relative to the contents of the children.
-     */
-    dialogPlacement?: 'top left' | 'top center' | 'top right' | 'right top' | 'right middle' | 'right bottom' | 'bottom left' | 'bottom center' | 'bottom right' | 'left top' | 'left middle' | 'left bottom';
-    /**
-     * The width of the dialog in pixels. The minimum possible width is 160px and the maximum width is 600px.
-     */
-    dialogWidth: number;
-    /**
-     * Optional element rendered below the body.
-     */
-    footer?: ComponentType<any>;
-    /**
-     * Optional element rendered above the body.
-     */
-    header?: ComponentType<any>;
-    /**
-     * Heading text rendered above the body.
-     */
-    heading?: string;
-    /**
-     * An optional element rendered to the right of the heading.
-     */
-    headingAfterElement?: ReactNode;
-    /**
-     * Path to the image.
-     */
-    image?: string;
-    /**
-     * The spotlight target node.
-     */
-    targetNode: HTMLElement;
-    /**
-     * A `testId` prop is provided for specified elements,
-     * which is a unique string that appears as a data attribute `data-testid` in the rendered code,
-     * serving as a hook for automated tests.
-     */
-    testId?: string;
-    /**
-     * Refers to an `aria-label` attribute. Sets an accessible name for the spotlight dialog wrapper to announce it to users of assistive technology.
-     * Usage of either this, or the `titleId` prop is strongly recommended to improve accessibility.
-     */
-    label?: string;
-    /**
-     * Refers to a value of an `aria-labelledby` attribute. References an element to define accessible name for the spotlight dialog.
-     * Usage of either this, or the `label` prop is strongly recommended to improve accessibility.
-     */
-    titleId?: string;
-}
-interface State {
-    focusLockDisabled: boolean;
-}
-/**
- * __Spotlight dialog__
- *
- * An onboarding spotlight introduces 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)
- */
-declare class SpotlightDialogComponent extends Component<SpotlightDialogProps, State> {
-    state: {
-        focusLockDisabled: boolean;
-    };
-    private focusLockTimeoutId;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): React.JSX.Element;
-}
-export default SpotlightDialogComponent;

package/dist/types-ts4.5/components/spotlight-inner.d.ts

@@ -1,58 +0,0 @@
-import React from 'react';
-import { type ScrollLogicalPosition, type SpotlightProps } from '../types';
-import { type ElementBoundingBox } from '../utils/use-element-box';
-interface SpotlightInnerProps extends SpotlightProps {
-    /**
-     * The spotlight target DOM element.
-     */
-    targetNode: HTMLElement;
-    /**
-     * Called when the component has been mounted.
-     */
-    onOpened: () => any;
-    /**
-     * Called when the component has been unmounted.
-     */
-    onClosed: () => any;
-    /**
-     * Whether to display a pulse animation around the spotlighted element.
-     *
-     * Same as `SpotlightProps` but required instead of optional.
-     */
-    pulse: boolean;
-    /**
-     * The width of the dialog in pixels. The minimum possible width is 160px and the maximum width is 600px.
-     *
-     * Same as `SpotlightProps` but required instead of optional.
-     */
-    dialogWidth: number;
-    /**
-     * passed to scrollIntoView as the block option, which determines the vertical alignment of the target node in the closest scrollable ancestor.
-     */
-    scrollPositionBlock?: ScrollLogicalPosition;
-}
-interface State {
-    replacementElement: HTMLElement | null;
-}
-/**
- * __Spotlight inner__
- *
- * Renders the spotlight target clone and dialog.
- *
- * @internal
- */
-declare class SpotlightInner extends React.Component<SpotlightInnerProps, State> {
-    static defaultProps: {
-        dialogWidth: number;
-        pulse: boolean;
-    };
-    state: {
-        replacementElement: null;
-    };
-    componentDidUpdate(prevProps: SpotlightInnerProps): void;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    getTargetNodeStyle: (box: ElementBoundingBox) => {};
-    render(): React.JSX.Element;
-}
-export default SpotlightInner;

package/dist/types-ts4.5/components/spotlight-manager.d.ts

@@ -1,83 +0,0 @@
-import React, { type ElementType, PureComponent, type ReactNode } from 'react';
-import { type MemoizedFn } from 'memoize-one';
-export type TargetRef = (element: HTMLElement | null | undefined) => void;
-export type GetTargetRef = (
-/**
- * The `name` prop passed to the corresponding `SpotlightTarget`
- *
- * This is used as a key into the `targets` map owned by `SpotlightManager`
- * because the `SpotlightManager` stores the target nodes for
- * descendant `SpotlightTarget` instances.
- */
-name: string) => TargetRef;
-declare const TargetConsumer: React.Consumer<GetTargetRef | undefined>;
-declare const SpotlightContext: React.Context<{
-    opened: () => void;
-    closed: () => void;
-    targets: {
-        [key: string]: HTMLElement | undefined;
-    };
-}>;
-declare const SpotlightStateConsumer: React.Consumer<{
-    opened: () => void;
-    closed: () => void;
-    targets: {
-        [key: string]: HTMLElement | undefined;
-    };
-}>;
-export { TargetConsumer };
-export { SpotlightContext, SpotlightStateConsumer as SpotlightConsumer };
-interface SpotlightManagerProps {
-    /**
-     * Boolean prop for toggling blanket transparency.
-     */
-    blanketIsTinted?: boolean;
-    /**
-     * Typically the app, or a section of the app.
-     */
-    children: ReactNode;
-    /**
-     * @deprecated
-     * Component is deprecated and will be removed in the future.
-     */
-    component?: ElementType;
-    /**
-     * Handler function to be called when the blanket is clicked.
-     */
-    onBlanketClicked?: () => void;
-}
-/**
- * __Spotlight manager__
- *
- * A spotlight manager manages the visibility of spotlights used to introduce 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.
- */
-export default class SpotlightManager extends PureComponent<SpotlightManagerProps, {
-    spotlightCount: number;
-    targets: {
-        [key: string]: HTMLElement | void;
-    };
-}> {
-    static defaultProps: {
-        blanketIsTinted: boolean;
-    };
-    componentDidMount(): void;
-    state: {
-        spotlightCount: number;
-        targets: {};
-    };
-    getTargetRef: (name: string) => (element: HTMLElement | null | undefined) => void;
-    spotlightOpen: () => void;
-    spotlightClose: () => void;
-    getStateProviderValue: MemoizedFn<(this: any, targets: any) => {
-        opened: () => void;
-        closed: () => void;
-        targets: any;
-    }>;
-    render(): React.JSX.Element;
-}

package/dist/types-ts4.5/components/spotlight-target.d.ts

@@ -1,50 +0,0 @@
-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;

package/dist/types-ts4.5/components/spotlight-transition.d.ts

@@ -1,45 +0,0 @@
-import React, { type ReactNode } from 'react';
-interface SpotlightTransitionProps {
-    /**
-     * Children that are conditionally rendered. The transition happens based
-     * on the existence or non-existence of children.
-     */
-    children?: ReactNode;
-}
-interface State {
-    currentChildren: ReactNode;
-}
-interface SpotlightTransitionContextModel {
-    isOpen: boolean;
-    onExited: () => void;
-}
-/**
- * __Spotlight transition__
- *
- * A spotlight transition holds onto spotlights so they can fade out when exiting the viewport.
- *
- * - [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 class SpotlightTransition extends React.Component<SpotlightTransitionProps, State> {
-    static getDerivedStateFromProps(props: SpotlightTransitionProps, state: State): {
-        currentChildren: React.ReactNode;
-    };
-    state: {
-        currentChildren: undefined;
-    };
-    onExited: () => void;
-    render(): React.JSX.Element;
-}
-/**
- * __Spotlight transition consumer__
- *
- * Used to consume the spotlight transition context through render props.
- *
- * @internal
- */
-export declare const SpotlightTransitionConsumer: React.Consumer<SpotlightTransitionContextModel>;
-export default SpotlightTransition;

package/dist/types-ts4.5/components/spotlight.d.ts

@@ -1,15 +0,0 @@
-import React from 'react';
-import { type SpotlightProps } from '../types';
-/**
- * __Spotlight__
- *
- * An onboarding spotlight introduces 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 Spotlight: ({ actions, actionsBeforeElement, children, dialogPlacement, dialogWidth, footer, header, heading, headingAfterElement, image, label, pulse, scrollPositionBlock, shouldWatchTarget, target, targetBgColor, targetNode, targetOnClick, targetRadius, targetReplacement, testId, titleId, ...rest }: SpotlightProps) => React.JSX.Element;
-export default Spotlight;

package/dist/types-ts4.5/components/theme.d.ts

@@ -1,10 +0,0 @@
-/**
- * @deprecated
- * Custom button themes are deprecated and will be removed in the future.
- */
-export declare const spotlightButtonTheme: (current: any, themeProps: Record<string, any>) => any;
-/**
- * @deprecated
- * Custom button themes are deprecated and will be removed in the future.
- */
-export declare const modalButtonTheme: (current: any, themeProps: Record<string, any>) => any;

package/dist/types-ts4.5/components/use-spotlight.d.ts

@@ -1,9 +0,0 @@
-/**
- * Use spotlight hook returns information about available spotlight targets.
- *
- * @deprecated Use `@atlaskit/spotlight` instead.
- */
-export default function useSpotlight(): {
-    isTargetRendered: (target: string) => boolean;
-    checkVisibility: (target: string) => (options?: CheckVisibilityOptions) => boolean;
-};

package/dist/types-ts4.5/components/value-changed.d.ts

@@ -1,11 +0,0 @@
-import React, { type ReactNode } from 'react';
-interface ValueChangedProps {
-    value: any;
-    onChange: Function;
-    children: ReactNode;
-}
-export default class ValueChanged extends React.Component<ValueChangedProps> {
-    componentDidUpdate(prevProps: ValueChangedProps): void;
-    render(): React.ReactNode;
-}
-export {};

package/dist/types-ts4.5/index.d.ts

@@ -1,2 +0,0 @@
-export { Modal, Spotlight, SpotlightCard, SpotlightManager, SpotlightTarget, SpotlightTransition, modalButtonTheme, spotlightButtonTheme, useSpotlight, ModalTransition, } from './components';
-export { Pulse as SpotlightPulse } from './styled/target';

package/dist/types-ts4.5/styled/blanket.d.ts

@@ -1,19 +0,0 @@
-type BlanketProps = {
-    isTinted?: boolean;
-    style?: React.CSSProperties;
-    onBlanketClicked?: () => void;
-    className?: string;
-};
-/**
- * __Blanket__
- *
- * A replacement for `@atlaskit/blanket`.
- *
- * We use this for spotlights instead of `@atlaskit/blanket`
- * because spotlights must sit on top of other layered elements,
- * such as modals, which have their own blankets.
- *
- * @internal
- */
-declare const Blanket: React.ForwardRefExoticComponent<React.PropsWithoutRef<BlanketProps> & React.RefAttributes<HTMLDivElement>>;
-export default Blanket;

package/dist/types-ts4.5/styled/dialog.d.ts

@@ -1,33 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ImgHTMLAttributes, type ReactNode } from 'react';
-/**
- * __Dialog image__
- *
- * An optional header image in spotlight dialogs.
- *
- * @internal
- */
-export declare const DialogImage: ({ alt, ...props }: ImgHTMLAttributes<HTMLImageElement>) => JSX.Element;
-/**
- * __Dialog action item container__
- *
- * Flex wrapper around dialog action items.
- *
- * @internal
- */
-export declare const DialogActionItemContainer: ({ children }: {
-    children: ReactNode;
-}) => JSX.Element;
-/**
- * __Dialog action item__
- *
- * Action items shown inside of the dialog.
- *
- * @internal
- */
-export declare const DialogActionItem: ({ children }: {
-    children: ReactNode;
-}) => JSX.Element;

package/dist/types-ts4.5/styled/modal.d.ts

@@ -1,51 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ReactNode } from 'react';
-type ModalImageProps = {
-    alt: string;
-    src?: string;
-};
-type ModalActionContainerProps = {
-    shouldReverseButtonOrder: boolean;
-    children: ReactNode;
-};
-/**
- * __Modal body__
- *
- * @internal
- */
-export declare const ModalBody: ({ children }: {
-    children: ReactNode;
-}) => JSX.Element;
-/**
- * __Modal heading__
- *
- * @internal
- */
-export declare const ModalHeading: ({ children, id, }: {
-    children: ReactNode;
-    id: string;
-}) => JSX.Element;
-/**
- * __Modal image__
- *
- * @internal
- */
-export declare const ModalImage: ({ alt, src }: ModalImageProps) => JSX.Element;
-/**
- * __Modal action container__
- *
- * @internal
- */
-export declare const ModalActionContainer: ({ children, shouldReverseButtonOrder, }: ModalActionContainerProps) => JSX.Element;
-/**
- * __Modal action item__
- *
- * @internal
- */
-export declare const ModalActionItem: ({ children }: {
-    children: ReactNode;
-}) => JSX.Element;
-export {};

package/dist/types-ts4.5/styled/target.d.ts

@@ -1,45 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type HTMLAttributes, type ReactNode } from 'react';
-type BaseProps = React.HTMLAttributes<HTMLDivElement> & {
-    bgColor?: string;
-    children?: ReactNode;
-    className?: string;
-    radius?: number | string;
-    testId?: string;
-};
-type TargetProps = Omit<BaseProps, 'css'> & {
-    pulse?: boolean;
-};
-/**
- * __Target inner__
- *
- * Used to apply spotlight border and pulse to spotlight targets.
- *
- * @internal
- */
-export declare const TargetInner: ({ bgColor, children, className, pulse, radius, testId, ...props }: TargetProps) => JSX.Element;
-/**
- * __Target overlay__
- *
- * Overlays a spotlight target, allowing for custom click events that are intended
- * only for onboarding.
- *
- * @internal
- */
-export declare const TargetOverlay: ({ onClick, ...props }: HTMLAttributes<HTMLDivElement>) => JSX.Element;
-/**
- * __Spotlight pulse__
- *
- * A spotlight pulse draws attention to a new feature.
- *
- * - [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.
- */
-export declare const Pulse: ({ bgColor, children, className, radius, pulse, testId, ...props }: TargetProps) => JSX.Element;
-export {};