@octopusdeploy/design-system-components
Version:
The design systems component library.
36 lines (35 loc) • 1.82 kB
TypeScript
import type React from "react";
import type { ReactElement } from "react";
import type { ButtonBasicProps, ButtonLinkProps } from "../Button";
import type { ErrorInfo } from "../Page";
import type { ProgressTrackerProps } from "../ProgressTracker";
import type { DialogWidth } from "./dialogBreakpoints.styles";
import type { MultiStepDialogProps, MultiStepNeverProps, SingleStepNeverProps } from "./dialogTypes";
type OnboardingDialogLimitedButtonProps = Pick<ButtonBasicProps, "label" | "onClick" | "disabled"> | Pick<ButtonLinkProps, "label" | "onClick" | "href" | "external">;
interface OnboardingDialogBaseProps {
title: string;
open: boolean;
onClose: () => void;
sidePanel: ReactElement;
errors?: ErrorInfo[];
width?: DialogWidth;
}
interface SingleStepOnboardingDialogProps extends OnboardingDialogBaseProps, MultiStepNeverProps {
primaryButton: OnboardingDialogLimitedButtonProps;
secondaryButton?: OnboardingDialogLimitedButtonProps;
children: React.ReactNode;
progressTracker?: ReactElement<ProgressTrackerProps>;
}
interface MultiStepOnboardingDialogProps extends OnboardingDialogBaseProps, MultiStepDialogProps, SingleStepNeverProps {
}
export type OnboardingDialogProps = SingleStepOnboardingDialogProps | MultiStepOnboardingDialogProps;
/**
* OnboardingDialog – an upsell-styled dialog with a main content panel and side panel.
*
* The side panel is always visible on desktop (stacks on mobile). The primary action button
* uses "loud" importance. For multi-step flows, pass the `steps` prop.
*
* @remarks Do not implement directly in Octopus Server code. Use Workflows instead. See https://docs.octopushq.com/docs/frontend/workflows
*/
export declare function OnboardingDialog(props: OnboardingDialogProps): import("react/jsx-runtime").JSX.Element;
export {};